react-native - 在按钮单击时反应原生 chagne 图像源

Question

嗨，我正在尝试单击按钮更改图像，但似乎无法更改图像。这是我的代码。

constructor(){
   super()
   this.state = {
      autologin_active: true
   }
}

toggleAutoLogin(){
   this.state.autologin_active = this.state.autologin_active ? false : true;
}


<TouchableHighlight onPress={() => this.toggleAutoLogin()} style={styles.registerButton} underlayColor='#99d9f4'>
  <View style={styles.detailBoxTick}>
    <Image style={styles.imageTickStyle} source={this.state.autologin_active ? Images.rememberTickImg : Images.rememberUnTickImg} />
    <Text style={styles.tickBoxText}>
      Auto Login
    </Text>
  </View>          
</TouchableHighlight>

有人可以帮忙吗？不知道我做错了什么。已通过警报检查状态是否在单击时发生变化。提前致谢

Answer 1

如果我正确理解了您toggleAutoLogin()，那么您正在更新您的状态，this.state.autologin_active = .....该状态正在更新状态，但会阻止重新渲染，这样您就看不到图像的变化。

您需要使用 setState({}) 更新状态才能重新渲染组件（图像）。

您的代码toggleAutoLogin()将是：

this.setState({ autologin_active: this.state.autologin_active ? false : true})