javascript - setState 不执行回调

标签 javascript reactjs react-native rxjs

我有一个选择过滤器,我想按类别过滤我的产品。状态已更新,但 setState 的回调未执行。基本上我想在状态改变时立即更新我的列表。代码第 31 行没有在 try block 中执行,也没有捕获任何错误。

HTML

<div className="col-md-4 w-25 mt-3 ml-5">
                <Select
                  onChange={this.handleChange}
                  value={selectedCategory}
                  placeholder="Select Category"
                  options={categories}
                />
   </div>

JavaScript

    handleChange = event => {
    console.log(event.value);
    this.setState({ selectedCategory: event.value }, () => {
      try {
        products.pipe(
          map(products =>
            products
              .filter(
                product => product.category === this.state.selectedCategory
              )
              .subscribe(products => {
                console.log(products);
                this.setState({
                  items: products,
                  isLoaded: true
                });
              })
          )
        );
      } catch (error) {
        console.error(error);
      }
    });
  };

enter image description here

最佳答案

这段代码成功了,但仍然不知道为什么它不起作用。谁能解释一下吗?

handleChange = 事件 => {

      this.setState(
        { selectedCategory: event.value },
        this.showFilteredProducts
      );
  };

  showFilteredProducts() {
    const filterItems = products.pipe(
      map(products =>
        products.filter(
          product => product.category === this.state.selectedCategory
        )
      )
    );
    filterItems.subscribe(products => {
      this.setState({
        items: products,
        isLoaded: true
      });
    });
  }

关于javascript - setState 不执行回调,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/60285453/

相关文章:

javascript - 如何以 float 存储 GLSL/WebGL 的状态标志

javascript - 拖古拉已加载但不工作

javascript - 使用Redux(Redux-Saga)的错误信息提示

reactjs - 提交值后如何重置 antd datepicker?

javascript - 如何使用 Jquery 重新加载特定的 div?

javascript - MarkLogic 8 Ingestion Job 在 JavaScript 中对集合进行非规范化

reactjs - 如何在 webpack 中使用 jest?

android - Cannot call class as a function 错误在 React Native 中

react-native - axios 请求后警报消息和按钮中的错误

android - 如何在 React Native 中使用来自服务器的 json 数据动态显示底部选项卡导航?