无法使用 useState() 设置值答案

【问题标题】：Unable to set value using useState()无法使用 useState() 设置值
【发布时间】：2020-11-23 11:25:17
【问题描述】：

我正在尝试设置从另一个函数导入的值。但是当我尝试使用useState() 设置它时，它会返回empty array。

代码：

function something() {
    const(dataDetails,setDataDetails) = useState([])

    useEffect(()=>{
        async function fetchDataValue() {
            api call using axios => fetched data
            setMailDataList(data)
        }
        fetchDataValue()
    }, [data])
    
    return(
        <ShowValue dataValue={dataDetails} />
    )
}

我尝试导入值的另一个页面：

function anotherfunction(props) {
   console.log(props.dataValue) // while doing this it prints the value

   const(newData,setNewData) = useState(props.dataValue)

   console.log(newData)   // this give me empty array 
}

所以当我尝试使用 useState 设置值时，它给了我一个空数组。因为我需要 setNewData 来更新 newData 的值以供进一步使用，所以我需要这种形式。

任何帮助将不胜感激。

【问题讨论】：

您正在将“数据”添加到 useEffect 中的数组中。这是从哪里来的？如果删除“数据”并留下一个空数组会发生什么？

标签： javascript node.js reactjs react-hooks

【解决方案1】：

你能确保你的代码遵循这种格式吗？

import React, { useState } from "react";

export default function App() {
  return <SomeComponent name="Hello" />;
}

const SomeComponent = (props) => {
  console.log("props.name", props.name);
  const [newState, setNewState] = useState(props.name);
  console.log("newState", newState);

  return null;
};

CodeSandBox

从codesandbox可以看出，控制台是正确的。

【讨论】：

function anotherfunction(props) { console.log(props.dataValue) // 执行此操作时会打印值 const(newData,setNewData) = useState(props.dataValue) console.log(newData) // 这给了我空数组 } 在 console.log(props.dataValue) 中，它提供了获取的所需数据，但只有在我这样做之后： const(newData,setNewData) = useState(props.dataValue) OR const newData = props .dataValue 并打印 newData 然后只有它给我空数组。所以数据已在 props.dataValue 中获取，但在我尝试将其设置为一些新变量后，它是空的
你需要使用方括号，而不是圆括号。
方括号在哪一部分？这个？ const(newData,setNewData) = useState(props.dataValue) 到 const(newData,setNewData) = useState([props.dataValue])??
对不起，这是我的错误，我只在我的实际代码中使用了方括号。错误地我在这里使用了圆括号。所以我的问题和我提到的一样
给我几分钟，乍一看它看起来是一样的......但如果有什么我会回复你。

【解决方案2】：

应该是方括号。而不是

const(newData,setNewData) = useState(props.dataValue)

应该是

const[newData,setNewData] = useState(props.dataValue)

【讨论】：