首頁  >  問答  >  主體

set***函數被呼叫但函數元件的重新渲染沒有執行

我的腳本如下圖所示,

api取得專案後,我想重新渲染元件並使EnhancedTable出現。

但這個腳本,api fetch 成功,但沒有出現EnhancedTable。

response.data 傳回正確的數據,但未執行重新渲染。

我哪裡錯了?

const MetaPanel = (props) =>{
    const [drawingItems,setDrawingItems] = React.useState([]);
    
    useEffect(() => {
        console.log("File List");
        var formData = new FormData();
        axios.defaults.xsrfHeaderName = "X-CSRFTOKEN";
        axios.defaults.xsrfCookieName = "csrftoken";
        axios.defaults.withCredentials = true;
        axios.get(`/api/drawings/`)
            
        .then(function (response) {
            console.log(response.data);
            setDrawingItems(response.data);
          
        })
        .catch(function (response) {
            console.log(response);
        });
    },[]);
    
    
    return (
    <div>
    <div>
        <p>FileList</p>
        {drawingItems.length != 0 &
           
            <EnhancedTable data={drawingItems}></EnhancedTable>
        }
    </div>
    </div>

    );
}

P粉864872812P粉864872812220 天前363

全部回覆(1)我來回復

  • P粉517814372

    P粉5178143722024-04-05 09:14:59

    你能嘗試一下嗎:

    FileList

    {drawingItems && }

    順便說一句,你可以改進 useEffect 部分

    useEffect(() => {
            const fetchData= async()=>{
              const response = await axios.get(`/api/drawings/`)
              if(response){
                setDrawingItems(response?.data);
              }
            }
           fetchData() 
        },[]);

    回覆
    0
  • 取消回覆