Question

在这一点上，我不能再直接考虑这个问题了：

我有一个应用程序，可以创建“基础”。访问新创建的基本组件时，该组件会获取用户列表，然后将其呈现在新组件上：

componentDidMount() {
    this.props.dispatch(fetchUsersOfList());
}

后台的reducer将用户添加到状态（如果有）。默认值为：

const initialState = {
    userBases: [],
}

访问新创建的组件时，我想添加（POST请求）一个默认用户（它是基础的创建者）并显示它。我只希望这样做一次，并希望通过检查防止添加发生一次以上：

render() {
    if (
        this.props.userBases.length !== 0 &&
        this.props.currentBase.id !== undefined
    ) {
        const userName = this.props.currentAuthUser;
        const baseId = this.props.currentBase.id;
        const acceptedMembership = true;
        const isCreator = true;
        this.props.dispatch(
            addUserToList(baseId, userName, acceptedMembership, isCreator)
        );
    }

我在某种程度上将if语句弄得一团糟，这样一个请求就被触发数十次，即使不是数百次也是如此。组装一个if语句以返回一个简单的userBases .map（如果存在），或者添加并显示一个与基本名称本身相同的默认用户，到底有多困难？

Answer 1

由于您在componentDidMount中调用fetchUsersOfList（），它将强制重新渲染。尝试将逻辑转移到componentWillMount

编辑：每次在化简器中设置状态时，也会强制重新渲染

组件多次转售并重复添加默认用户

1 个答案: