我有一个加载图表的按钮
<li className="pull-right"><a className=" btn btn-default" onClick={this._saveChartDashboard.bind(this)}>Load</a></li>
_saveChartDashboard(){
let data = {
dashboardId : this.props.params.dashboardId,
chartIds : this.state.selectedChartId,
userName: "demo"
}
DataConnectionAction._addChartToDashboard(data, ()=>{
DataConnectionAction._dashboardChart({dashboardId:
this.props.params.dashboardId});
});
}
我在_addChartToDashboard
函数上有一个回调。最初,我已将一个图表加载到仪表板,
再次将另一个图表加载到仪表板,当再次加载第二个图表时,我得到了3个图表,其中第一个图表gettig重复了。
代替回调,如果我重新加载页面,那么不用重新加载页面就可以了,不用回调,如何使用初始加载的图表进行更新。
在数据连接商店更改中,我正在从商店获取数据
if(type == 'SavedChartDatainDashboard'){
let data = JSON.parse(JSON.stringify(DataConnectionStore._getData('savedChartinDashboard')));
let saveLayoutchart = DataConnectionStore._getSaveLayout() || {};
var layout = this.generateLayout(data.length, saveLayoutchart);
this.setState({
saveLayoutchart
});
this.setState({
savedChartinDashboard: data,
layout
}, () => {
if(data && data[data.length - 1].nextChartId)
DataConnectionAction._dashboardChart({
dashboardId: this.props.params.dashboardId,
chartId: data[data.length - 1].nextChartId,
});
});
}
onLayoutChange我遇到错误
onLayoutChange(layout, dashboardId) {
let saveLayoutchart = DataConnectionStore._getSaveLayout() || {};
this.setState({
saveLayoutchart
});
var dashObj={};
dashObj.dashboardId=this.props.params.dashboardId;
var dashboardLayout={};
var layoutChartId= saveLayoutchart.responseDto && saveLayoutchart.responseDto.chartIds;
for(var i=0;i<layout.length;i++)
{
dashboardLayout[layoutChartId[i]] = layout[i];
}
dashObj.dashboardLayout=dashboardLayout;
DataConnectionAction._saveLayoutToDashboard(dashObj);
}
generateLayout
功能
generateLayout(chartCount,layoutObj) {
var layout = [], x, y, i;
if(layoutObj.responseDto && layoutObj.responseDto.dashboardLayout!=null)
{
var keysArr=[];
Object.keys(layoutObj.responseDto.dashboardLayout)
.forEach(function eachKey(key) {
keysArr.push(key);
});
for (i = 0; i <= chartCount - 1; i++) {
y = Math.ceil(Math.random() * 4) + 1;
layout[i] = {x:layoutObj && layoutObj.responseDto && layoutObj.responseDto.dashboardLayout[keysArr[i]] && layoutObj.responseDto.dashboardLayout[keysArr[i]].x, y:layoutObj && layoutObj.responseDto && layoutObj.responseDto.dashboardLayout[keysArr[i]] && layoutObj.responseDto.dashboardLayout[keysArr[i]].y, w: layoutObj && layoutObj.responseDto && layoutObj.responseDto.dashboardLayout[keysArr[i]] && layoutObj.responseDto.dashboardLayout[keysArr[i]].w, h: layoutObj && layoutObj.responseDto && layoutObj.responseDto.dashboardLayout[keysArr[i]] && layoutObj.responseDto.dashboardLayout[keysArr[i]].h, minW: 2, maxW: 6, minH:10, maxH: 100, isResizable: true, isDraggable: true, i: i.toString()};
}
}
else
{
for (i = 0; i <= chartCount - 1; i++) {
y = Math.ceil(Math.random() * 4) + 1;
layout[i] = {x: i * 2 % 12, y: Math.floor(i / 6) * y, w: 2, h: 13, minW: 2, maxW: 6, minH:10, maxH: 100, isResizable: true, isDraggable: true, i: i.toString()};
}
}
return {lg:layout};
}