reactjs - React Native setState 不重新渲染

Question

这个组件的预期行为是这样的：我按下它，selectedOpacity() 函数被调用，状态被更新，所以它现在以 opacity=1 呈现。

但是由于某种原因，在调用 this.setState 之后，它并没有被重新渲染。我必须再次单击此组件以使其重新渲染并应用状态的不透明度更改。

export default class Category extends Component {

state = {
  opacity: 0.5
}

selectedOpacity() {
  // some stuff
  this.setState({opacity: 1})
}

render() {
 return(
  <TouchableOpacity style={[styles.container, {opacity: this.state.opacity}]} onPress={() => {
    this.selectedOpacity();
  }}>
  </TouchableOpacity>
 )
}

标签： reactjsreact-nativestaterender

Answer 1

将selectedOpacity更改为箭头函数：

selectedOpacity = () => {
  this.setState({opacity: 1})
}

然后：

onPress={this.selectedOpacity}

编辑：反应文档说它的实验性和语法称为公共类字段语法。