反应原生未定义对象答案

【问题标题】：react native undefined object反应原生未定义对象
【发布时间】：2021-04-29 14:47:39
【问题描述】：

我这样设置状态：

const [address, setAddress] = useState('');

我把这个对象放入 setAddress:

{"street_number":"1","street":"Wheins","city":"Denmark"}

我想这样输出数据：

address.street_number, address.street ...

但我没有定义。为什么？

【问题讨论】：

请分享有问题的实际代码。另见How to create a Minimal, Reproducible Example。您的示例不完整（即它不包含重现问题的所有相关部分）。
此外，如果address 应该是一个对象，则不应使用空字符串对其进行初始化。

标签： json reactjs react-native expo

【解决方案1】：

要使用状态，根据您的用例，这样的方法可能会起作用：

...
const [address, setAddress] = useState('');

setAddress({"street_number":"1","street":"Wheins","city":"Denmark"});

return (
    <>
        <p>Address: {address.street_number}, {address.street}, {address.city}</p>
    </>
);
...

这完全取决于您尝试如何使用它？这不在原始问题中。如果setAddress 在回调中或在第一次渲染时它可能不可用，那么您可能想要执行以下操作：

...
const [address, setAddress] = useState(false);

setAddress({"street_number":"1","street":"Wheins","city":"Denmark"});

return (
    <>
        {address && (<p>Address: {address.street_number}, {address.street}, {address.city}</p>)}
    </>
);

...

【讨论】：

【解决方案2】：

我认为您正在从 API 端点获得上述响应..

那么，

console.log(address["street_number"]) // this will output "1"

console.log(address["street"]) // this will output "Wheins"

是的，你应该使用一个对象来初始化状态，

像这样 -

const [address, setAddress] = useState({});

【讨论】：

【解决方案3】：

您可能正试图在您设置它的同一范围内访问地址状态。但是你应该等待重新渲染。所以这行不通：

setAddress({'street_number':'1', 'street':'Wheins', 'city':'Denmark'});
console.log('address.street_number:', address.street_number); // output: undefined

你可以使用 useEffect() 钩子来监听你的状态变化，然后开始使用它：

  useEffect(() => {

    console.log(address.street_number); // output: 1

  }, [address]);

【讨论】：