初始准备工作
constructor(props) { super(props); /* * 构建导出数据的初始参数,结合用户下拉选择后动态设置参数值 * */ this.state = { btnStatus: false, dateStart: '', dateEnd: '', currentType: 2, }; }
中间核心操作逻辑:在下拉菜单改变的时候触发一次设置操作:
props:{ onChange: (value)=>{ console.log('value',value); if(value !== '-1'){ this.setState({btnStatus: true}); }else if(value === '-1'){ this.setState({btnStatus: false}); } } }
界面组件展示区域:
<a href="/assets/templatefile/XXX.xlsx" style={{float: 'right',paddingRight: '20px'}}> {this.state.btnStatus===false ? <Button type="button" disabled className="ant-btn-primary ant-btn-lg"><span>批量导出</span></Button> : <Button type="button" className="ant-btn-primary ant-btn-lg"><span>批量导出</span></Button>} </a>