Question

我有这个代码

export interface Y{
  title: string;
  name: string;
}

const [x, setX] = useState<Y>(Object);

但是我的朋友们说这是个坏主意。为什么不好用这个useState（Object）？

Answer 1

好吧，我发现奇怪的是，您将Object传递给useState挂钩。

export interface Y{
  title: string;
  name: string;
}

const [x, setX] = useState<Y>();

在那种情况下，x的类型为Y | undefined，这更好，因为现在我们知道x为空。

像以前那样传递Object会使打字稿高兴，但现在您欺骗自己，因为打字稿无法保护您。

根据情况，我建议走第一条路线，将useState保留为空，或者将硬编码对象结构保留为例如

const [x, setX] = useState<Y>({title: '', name: ''});

如果问题是使用useReducer还是useState-我认为这全取决于您要更改对象的频率。如果逻辑足够简单，则使用useReducer可能会显得过大。另外，不要忘记useState只是useReducer钩afaik的包装。

Answer 2

const [x, setX] = useState<Y>(Object);

这不是有效的打字稿，因为使用通用参数<Y>会使类型系统期望初始状态为Y类型（或为null），从而成为唯一有效的输入{{ 1}}或useState({ title: '', name: '' })

此外，useState挂钩不会对状态进行部分更新。

useState(null)

在性能和推理方面，这对于小型对象是可以的，但是当您有大型状态对象时，状态管理会变得很困难。但是将状态分解为许多变量会使代码变得冗长。在这种情况下，您可以使用reducer hook。

Answer 3

以下代码对我有用

const [selectedAccount, setselectedAccount] = useState(Object);