【问题标题】:React Native Redux not updating Boolean valueReact Native Redux 不更新布尔值
【发布时间】:2020-10-16 09:24:33
【问题描述】:

我为我的购物应用创建了一个布尔状态,当用户单击购买按钮时,它应该将该状态设置为 true 并在容器中显示购物车总数,但它不起作用。

下面是我的代码:

减速器:

 if (action.type === SHOW_CART) {
    return {
      ...state,
      show: action.showCart,
    };

const initialstate = {
  show: false,
}

这是我的初始状态的减速器:

export const showCart = () => {
  return {
    type: SHOW_CART,
    showCart: true,
  };
};

这是我的行动:


    <View style={styles.buy}>
         <Text
            onPress={() => {
            this.props.addToCart(item.id);
            this.props.showCart();
               }}
          >
          Buy Once
          </Text>
    </View>
const mapStateToProps = (state) => {
  return {
    items: state.clothes.jeans,
  };
};

const mapDispatchToProps = (dispatch) => {
  return {
    addToCart: (id) => dispatch(addToCart(id)),
    showCart: () => dispatch(showCart()),
  };
};

在这段代码中我使用了一个平面列表,在平面列表中我使用了onPress 来显示购物车容器并调度我的操作

应用程序

 export default function App() {
  return (
    <>
      <Provider store={Store}>
        <NavigationContainer>
          <AppNavigation />
        </NavigationContainer>
        <ViewChart />
      </Provider>
    </>
  );
}

ViewCart.js

  <View>
        {this.props.show ? (
          <View style={styles.total}>
            <Text style={styles.totaltext}>Total:</Text>
            <Text style={styles.priceTotal}>{this.props.total}</Text>
            <View style={styles.onPress}>
              <Text
                style={styles.pressText}
                onPress={() => this.props.navigation.navigate("Cart")}
              >
                View Cart
              </Text>
            </View>
          </View>
        ) : null}
      </View>
const mapStateToProps = (state) => {
  return {
    total: state.clothes.total,
    show: state.clothes.show,
  };
};

export default connect(mapStateToProps)(ViewChart);

在 App.js 中我添加了视图购物车的容器,当用户点击购买时应该显示 在视图购物车中我收到错误undefined is not an object (evaluating '_this.props.navigation.navigate')

【问题讨论】:

  • this.props.showCart;应该是 this.props.showCart();
  • 没有工作会引发错误_this.props.showCart is not a function.
  • addToCart 有效吗?
  • 是的,它正在工作
  • showChar 应该是 showCart

标签: javascript reactjs react-native redux


【解决方案1】:

改变

this.props.showCart;

this.props.showChart();

【讨论】:

  • 已经抛出错误_this.props.showCart is not a function.
  • 不是“showCart”,而是您在代码中描述的“showChart”,请检查
  • 我更新了我的代码,现在错误出现在 ViewCart.js 中,而且它还在购物车组件中显示视图购物车
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2021-08-23
  • 2017-12-07
  • 1970-01-01
  • 1970-01-01
  • 2021-05-06
  • 1970-01-01
相关资源
最近更新 更多