javascript - 怎么在Promise中返回值?
本文介绍了javascript - 怎么在Promise中返回值?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
问 题
1、有如下React代码:
class Qu extends Component {
render() {
let { value, getDataPromise, onChange } = this.props;
//这边尝试加return但是返回值是Promise
return Promise.resolve(getDataPromise).then(list => {
//这边的return返回的是then函数,所以render得不到DOM
return (
<select className="form-control" value={value} onChange={onChange}>
<option value={''}>全部</option>
{list.map((item, index) => (
<option key={index} value={item.code}>{item.name}</option>
))}
</select>
);
})
}
}
Qu.propTypes = {};
Qu.defaultProps = {};
export default Qu;
2、这里要怎么做才能让DOM返回render函数?因为数据是依赖getDataPromise函数的?
解决方案
试试这样写,把数据请求放在渲染之后:
class Qu extends Component {
constructor(props) {
super(props);
this.state = {list: null};
}
componentDidMount() {
this.props.getDataPromise().then(list => {
this.setState({list});
});
}
render() {
const {value, onChange} = this.props;
const {list} = this.state;
if (!list) return null;
return (
<select className="form-control" value={value} onChange={onChange}>
<option value={''}>全部</option>
{list.map((item, index) => (
<option key={index} value={item.code}>{item.name}</option>
))}
</select>
);
}
}
这篇关于javascript - 怎么在Promise中返回值?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文