this.text ='a'与this.setState（{text：a'}）的区别是什么

Question

我知道状态改变时组件将重新渲染。但在这段代码中：

 <ColorPicker
     onColorSelected={color => this.color = color}
     style={{ width: width / 2, height: 200 }}
 />
     <View style={{ width: width / 2, height: 200, justifyContent: 'center' }}>
          <AnimatedText style={{ fontSize: 25, fontWeight: "bold", color:  this.color }}> asdasdasdasdasd</AnimatedText>
     </View>

无状态更改，但文本颜色仍然更改。那么setState的含义是什么？即时通讯的方式，是否会使性能更好？

Answer 1

this.setState({text:a'})将调用渲染方法，this.text = 'a'将不会调用

。

---

反应建议使用状态道具更新ui。

---

this.text = 'a'将在分配后立即运行，但this.setState({text:a'})将批量运行