共计 735 个字符,预计需要花费 2 分钟才能阅读完成。
1. 使用解构方法操作一个深层的对象,再 setState, 可能不会触发 render(ios 以及 Android 模拟器和真机调试都正常,只有打包发布之后 Android 有这个问题)。
... | |
/* React | |
state = { | |
data: {'2019-07-19': {...}, | |
'2019-07-20': {...}, | |
} | |
} | |
*/ | |
const data = this.state.data; | |
// 待解构的数据源 | |
const obj = { | |
some_attr: 'test', | |
other: {sex: 'man',} | |
} | |
// 被用来 setState 的临时数据 | |
const data_tmp = { | |
name: '张三', | |
age: 18, | |
...obj.other | |
} | |
data['2019-07-19'] = data_tmp | |
this.setState({data}) | |
// 这种情况会导致上述情况 | |
// 解决办法 不使用解构 使用 for in 把属性插入 | |
const data_tmp = { | |
name: '张三', | |
age: 18 | |
} | |
for(key in obj.other) {data_tmp[key] = obj.other[key] | |
} | |
data['2019-07-19'] = data_tmp | |
this.setState({data}) |
上述问题有点奇怪,暂时不明原因,查明原因会补充真想,有大神知道原因评论区交流 ^_^
2. 多个 setState 同步执行也会导致不触发 render(ios 以及 Android 模拟器和真机调试都正常,只有打包发布之后 Android 有这个问题)。
[1,2,3].forEach(item, () => { | |
this.setState({data: {...} | |
}) | |
}) |
和第一个问题差不多,也是导致 Android 实体机有问题
有更多坑的同学的可以一起分享交流,后续会持续更新 …
正文完
发表至: javascript
2019-07-19