码迷,mamicode.com
首页 > 其他好文 > 详细

组件化-select list

时间:2020-01-13 16:00:27      阅读:90      评论:0      收藏:0      [点我收藏+]

标签:com   error   callback   manage   接收   key   type   modal   data   

(一)page

1 引入ant message 组件
2 定义state中接收数据
state = {
stateData:[],
};
3 请求数据
componentDidMount() {
  this.queryStateSelectList()
}

queryStateSelectList = ()=>{
    const { dispatch } = this.props;
    dispatch({
      type: ‘TaskManage/StateSelectList‘,
      payload: ‘‘,
      callback:(res)=>{
        if(res.code == 20000){
          this.setState({stateData:res.data})
        }else{
          message.error(res.msg)
        }
      }
    });
  }

{this.renderSelectOption(stateData,‘key‘,‘val‘)}
renderSelectOption = (data,key,val)=>{
let arr = []
if(data && data.length > 0){
data.map((item)=>{
arr.push(<Option value={item[key]} key={item[key]}>{item[val]}</Option>)
})
}
return arr;
}




(二)modal
*StateSelectList({ payload, callback }, { call }) {
const response = yield call(StateSelectListReq, payload);
if (callback) callback(response);
},

(三)services

export async function StateSelectListReq() {
  return request(‘/task/types‘);
}
 

组件化-select list

标签:com   error   callback   manage   接收   key   type   modal   data   

原文地址:https://www.cnblogs.com/sunxiaolong905417077/p/12187462.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!