如果数组存在，则设置状态

Question

如果服务器中的数据存在，我只需要设置一个状态。

const [names, setNames] = useState([...details?.names])

details对象在props中，并且是从数据库中设置的。details.names是来自服务器的一个数组。当details.names对象存在，但如果details对象中不存在这些名称，我就会遇到问题。如果是这种情况，请将Names设置为一个空数组。

Answer 1

您可以简单地执行以下操作：

const [names, setNames] = useState(details?.names ? [...details?.names] ?? [])

如果details?.names是一个数组，那么唯一需要的就是：

const [names, setNames] = useState(details?.names ?? [])

所以基本上使用Nullish合并运算符，在这里阅读更多关于它的信息：

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Nullish_coalescing_operator

Answer 2

您可以使用useEffect挂钩来检测details变量的更改并触发状态更新：

const [names, setNames] = useState([])

useEffect(() => {
if (details?.names) {
setNames(details.names)
}
}, [details])