Question

我在react showPeople中有一个功能。这是代码：

const showPeople = () => {
    const people = workers.map((worker, i) => {
        return (
            <div>
                <Worker
                    id={worker.id}
                    index={i}
                    role={worker.role}
                />
            </div>
        )
    })
    return people;
}

稍后在组件中，我想调用此函数，以便向我显示一些有关工人的信息。我这样称呼它：

<div>
  {showPeople()}
</div>

这可以，但是只调用一次。当我更改状态时，它不会被调用。因此，只有在刷新页面后才能获取更新。如果删除通话中的括号，屏幕上什么也没有。有谁知道这是什么问题？抱歉，如果该问题重复，我不确定我之前是否理解过与他的主题相关的任何答案。谢谢

Answer 1

在撰写本文时，它应该在状态更新（see example here）时更新。除非您保存了数组workers（例如像const {workers} = this.state或const [workers, setWorkers] = useState([{'id': '1', role: 'thisRoleNAme'}])这样的数组，否则您可能实际上并没有访问状态。

Answer 2

编辑您的函数以将worker用作参数：

const showPeople = (workers) => {
 const people = workers.map((worker, i) => {
    return (
        <div>
            <Worker
                id={worker.id}
                index={i}
                role={worker.role}
            />
        </div>
    )
})
return people;
}

并让工人离开州。

<div>
 {showPeople(this.state.workers)}
</div>

只要您的this.state.workers发生更改，它都应该重新渲染，并且它将与新的worker一起渲染。

状态更改时不调用函数

2 个答案: