一.举例：对于 echatrs 的柱子分别需要弹窗 带参数 触发弹窗出现事件 showModalhref
1 myChart.on('click', (params) => {
2 switch (params.seriesIndex) {
3 // echarts 双柱1
4 case 0: this.showModalhref('kjxy', industryBar_list.list, params);
5 break;
6 // echarts 双柱2
7 case 1: this.showModalhref('cpxy', industryBar_list.list, params);
8 break;
9 default: break;
10 }
11 });
二、modal
state = {
modalShowHref: {
visibleHref: false,
type: '',
data1: [],
data2: {},
},
}
<Modal
visible={this.state.modalShowHref.visibleHref}
onOk={this.okModalhref}
onCancel={this.hideModalhref}
okText="确认"
cancelText="取消"
width={278}
className={styles.hrefModal}
>
<p>确定跳转吗?</p>
</Modal>
三、点击onOk时
okModalhref = () => {
const { modalShowHref } = this.state;
const { type } = modalShowHref;
const { data1 } = modalShowHref;
const { data2 } = modalShowHref;
if (type === 'kjxy') { // 框架协议 (arr, params)
const obj = data1.find(t => t.name === data2.name);
const { corpCstTps } = obj;
this.props.dispatch(routerRedux.push({
pathname: '/QYGL/kjxy/query',
state: {
corpCstTps,
},
}));
} else if (type === 'cpxy') { // 产品协议 (arr, params)
const obj = data1.find(t => t.name === data2.name);
const { corpCstTps } = obj;
this.props.dispatch(routerRedux.push({
pathname: '/QYGL/cpxy/searchList',
state: {
corpCstTps,
},
}));
}
};
四、点击onCancel时
/////弹窗中 取消事件
hideModalhref = () => {
this.setState({
modalShowHref: {
visibleHref: false,
type: '',
data1: [],
data2: {},
},
});
};