在React Native中调用onPress后渲染另一个按钮

Question

我的视图中有一个按钮，所以当按下按钮时，我想隐藏当前按钮并渲染一个新按钮。

  renderButton(item) {
      if(this.props.cartButtonPressed) {
         return <ActivityIndicator />
   }
   return <Button color ='#FFF' fontSize={12} buttonStyle={styles.button} 
               containerViewStyle={styles.buttonContainer} title='Add to cart' 
        onPress={() => this.onButtonPress(item)}/>          
   }

这是我的代码示例，但它不起作用。

编辑＃1

 render () {
    return (
      <View>

        <FormLabel>Email</FormLabel>
        <FormInput onChangeText={this.onEmailChange.bind(this)} value={this.props.email}/>
        <FormLabel>Password</FormLabel>
        <FormInput secureTextEntry onChangeText={this.onPasswordChange.bind(this)} value={this.props.password}/>
        <Text style={styles.errorText}> {this.props.error} </Text>
        {this.renderButton()}

      </View>
    );
  }
 }

编辑＃2

const INITIAL_STATE = {
  cartItems: [],
  cartButtonPressed: false
}

export default (state = INITIAL_STATE, action) => {
  switch(action.type) {
    case ADD_TO_CART:
    return {
      ...state,
      cartItems: [...state.cartItems, action.payload],
      cartButtonPressed: true
    };

    default:
    return state
  }
};

我使用以下内容将状态变量映射到道具：

const mapStateToProps = ({ cart }) => {
  const { cartButtonPressed } = cart;
  return {
    cartButtonPressed
  }
}