React.useStateHook只顯示物件的長度，而不是物件本身-有解無憂

基本上，我有一個名為 Upload 的組件：

const Upload = () => {
    const [scene , setScene] = React.useState([]);

    // handleUpload = (event) => {
    //     console.log('Success!');
    // }


    function renderHandler(s){
      console.log('[RENDER] calling...')
      console.log(s);

      if(scene.length == 0){
        console.log('[RENDER] Denied!')
        return(
          <div>
            Nothing is rendered..
          </div>
        )
      } else {
        console.log('[RENDER] Working...')
        console.log('[RENDER] Received planes:');
        console.log(blockState);
        console.log(scene);

        return (
          <View top={blockState}/>
        )
      }
    }

    function parseNBT(input) {
      setScene(scene.push('1'));
      setScene(scene.push('2'));
      console.log('scene:');
      console.log(typeof scene);
      console.log(scene);
      console.log('\n blockState:');
      console.log(typeof blockState);
      console.log(blockState)



    }
     return (
    <Container>
    Input NBT file <br/>
    <input type="file" onChange={handleChange}></input>
    {renderHandler(scene)}
    </Container>
  )
}

這里的問題是，當我在 parseNBT 和控制臺日志場景中設定場景狀態時，它給了我陣列：

React.useState Hook 只顯示物件的長度，而不是物件本身

但是，當我從 renderHandler 呼叫它時，它只回傳陣列的長度，在本例中為 2 React.useState Hook 只顯示物件的長度，而不是物件本身

很奇怪，也許我錯過了什么？

uj5u.com熱心網友回復：

回傳陣列的.push長度。

回傳值呼叫方法的物件
的新屬性。length

嘗試

  setScene( currentScene => [...currentScene, '1'] );
  setScene( currentScene => [...currentScene, '2'] );

uj5u.com熱心網友回復：

簡而言之，當它是不可變的時，您將“場景”視為可變物件。這意味著，當您嘗試執行“scene.push”時，它正在嘗試修改不可變物件。常規陣列是可變的，但不是反應狀態陣列。因此，您不想直接對場景進行更新，您想獲取其先前的狀態，將其與您的新期望值連接，然后將該新值設為您的新狀態。

像這樣：

替換你的行：

  setScene(scene.push('1'));
  setScene(scene.push('2'));

和：

 setScene((scene) => [...scene, 1]);
 setScene((scene) => [...scene, 2]);

轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/453276.html

標籤：反应反应钩子反应状态

上一篇：在選項卡導航器中添加堆疊導航器

下一篇：實作用于收集資料流和處理的C 多執行緒的標準方法