我可以在反应函数组件中使用"let"吗？

Question

我目前正在学习React。

我可以在函数组件中使用"let"而不是使用"useState"吗？

const Func = () => {
let fruit = "banana";
const changeFruit = () => {
fruit = "apple"
};
changeFruit();
}

const Func = () => {
const [fruit, setFruit] = useState("banana");
const changeFruit = () => {
setFruit("apple");
};
changeFruit();
}

Answer 1

这不是一个功能组件，因为功能组件必须返回一个React元素。

如果它是一个功能组件，并且在返回Element之前同步更改变量，这很好：

const Func = () => {
let fruit = "banana";
const changeFruit = () => {
fruit = "apple"
};
changeFruit();
return <>{fruit}</>; // displays "apple"
};

如果您异步更改，例如

setTimeout(changeFruit, 1000);

则组件在变量更改后不会重新发送。这不是你通常想要的。如果useState并调用setFruit函数，则组件会重新应答。

Answer 2

我可以在函数组件中使用"let"而不是使用"useState"吗

答案是否定的，你不能用let代替state。你的组件不会重新渲染，这就是的全部状态

请考虑React文档，以帮助您理解React 中的状态概念

希望它能帮助