在按钮单击时反应原生 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})