Question

React点击一次按钮能获取到数据但是却无法显示到页面上

onExpand = (expanded, record) => {
console.log(record)
let desipertion;
function expand() {
return new Promise((resolve, reject) => {
window.rpc.task.device.getArrayBriefByContainer({ id: record.id }, 0, 0).then((res) => {
resolve();
desipertion = res.map(x => ({ ...x, key: x.id, setupTime: moment(x.createTime).format('YYYY-MM-DD'), type: x.typeName }));
})
})
}
async function execute() {
await expand();
record.desipertion = desipertion;
console.log(record.desipertion)
}
execute();
}
这里我点击会触发这个函数,能获取到record.desipertion数据,但是无法显示到页面上,要我点击第二次才能显示上一次的数据,这里我用了ant design框架写的
求大神解释~~在线等!!

Answer 1

你获取到数据后，然后调用setstate方法，改变状态，然后你的组件要定义个接受状态改变的地方，比如value={this.state.*}，一旦检测到你状态改变就会去render组件重新绘制，并且由于value的值和状态绑定所以value也会变。