代码必须遍历“数据”并在DOM中创建三个图表。 实际代码很长,不易重现。这是一个模拟代码。我知道不建议通过jQuery append方法追加DOM。
和模拟代码是这样的:
<add name="accVerifier" providerName="Oracle.ManagedDataAccess.Client" connectionString="Data Source=(DESCRIPTION=(ADDRESS=(PROTOCOL=)(HOST=)(PORT=))(CONNECT_DATA=(SERVICE_NAME=)));User ID ="";Password="";Persist Security Info=True;Max Pool Size=150;Connection Timeout=60;" />
错误是“Uncaught TypeError:(0,_jquery2.default)(...)。appendTo(...)。highcharts不是函数”
当我更改代码时 从:
export class Combination extends React.Component {
componentDidMount(){
$.ajax(url:'something'
...
success(data): {
data.map(function(dataset){
$('<div id="chart">')
.append('#combination')
.highchart({
chart: {
...
}
})
}
}
)
}
}
为:
.highchart({
...
但它创造的是这样的:
Highchart.chart('chart',{
})
它必须创建如下图表:
<div id='chart' data-highcharts-chart="2"></div>
<div id='chart'></div>
<div id='chart'></div>
很明显它没有正确迭代。
答案 0 :(得分:0)
我同意@Daniel Zuzevich认为jQuery与React没有很好的结合。所以从根本上说,这种方法是有缺陷的。
话虽如此,我猜这是因为你使用静态id
。为什么不尝试为每个映射项创建唯一的id
。
data.map(function(dataset, key){
$(`<div id="chart${key}">`)
.append('#combination')
Highchart.chart(`chart${key}`, {
chart: {
...
}
})