Javascript redux中单个减速器的加载状态

在redux中，我的减速机只使用一个加载程序状态时出现问题。目标是确保每个不同的按钮在点击api之前都有“加载…”，现在的问题是所有按钮都会显示“加载…”

我为这个问题创建了一个演示

---

您需要分离加载状态，目前您只有一个加载状态，您可以根据该状态做出决定，但您需要确定加载状态是针对他们还是针对其他人。您可以将加载状态重命名为

approve\u loading

和

reset\u loading

，并像这样使用它们

@connect(state => state.items, { approveItem, resetItem })
export default class Items extends Component {
  render() {
    return (
      <div>
        <div>status: {this.props.item.status}</div>
        <button onClick={() => this.props.resetItem()}>
          {this.props.reset_loading ? "loading..." : "Reset"}
        </button>
        <button onClick={() => this.props.approveItem()}>
          {this.props.approve_loading ? "loading..." : "Approve"}
        </button>
      </div>
    );
  }
}

@connect（state=>state.items，{approvietem，resetItem}）
导出默认类项扩展组件{
render（）{
返回(
状态：{this.props.item.status}
this.props.resetItem（）}>
{this.props.reset_加载？“加载…”：“重置”}
this.props.approvietem（）}>
{this.props.approve_加载？“加载…”：“批准”}
);
}
}

或者以不同的方式构造减速器

---

对于相同的

您必须为每个提取操作指定不同的加载标志

IsReseting

，

isApproving

@Varider意味着我必须为所有按钮手动执行此操作？无法打开您的codesandbox，

错误无法读取未定义的属性“startsWith”