Question

我在redux中仅为reducer使用一个加载器状态时遇到问题。目标是确保每个不同的按钮都有加载...＆＃39;在他们点击api之前，现在问题是所有按钮都会显示＆＃39; loading ...＆＃39;

我为这个问题创建了一个演示 https://codesandbox.io/s/jlq103oq1v

Answer 1

您需要单独加载状态，目前您只有一个加载状态，并且您根据该状态做出决定，但是您需要确定加载状态是否适用于他们或其他人。您可以将加载状态重命名为approve_loading和reset_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>
    );
  }
}

<强> working codesanbox

或以不同方式构建您的reducer，

working sandbox用于相同的

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

1 个答案: