我对Reaction还很陌生，我遇到这个问题:当try 将一个数组映射到Reaction有状态组件列表时，我的所有组件都会失go 其状态.我的代码是:
const { useState, useEffect} = React;
const htmlRoot = document.getElementById('root');
const reactRoot = ReactDOM.createRoot(htmlRoot);
const App = () => {
const Item = (props) => {
const [count, setCount] = useState(0);
useEffect(() => {
const timer = setInterval(() => {
setCount((lastCount) => lastCount + 1);
}, 1000);
return () => clearInterval(timer);
}, []);
return <h1>{props.children + ' ' + count}</h1>;
};
const arr = [1, 2, 3];
const [arrState, setArrState] = useState(arr);
const clickHandler = () => {
setArrState((lastArrState) => [
...lastArrState,
lastArrState.at(-1) + 1,
]);
};
return (
// Unfortunately, Stack Snippets don't support the shorthand form
// of fragments
<React.Fragment>
{arrState.map((num, index) => (
<Item key={index}>{num}</Item>
))}
<button onClick={clickHandler}>Click Me</button>
</React.Fragment>
);
};
reactRoot.render(<App />);<div id="root"></div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/18.1.0/umd/react.development.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/18.1.0/umd/react-dom.development.js"></script>对他们来说，这有可能保持他们的状态吗？如果是，那是怎么回事？ 最新情况: