反应原生未定义对象

时间:2021-04-29 14:47:39

标签: json reactjs react-native expo

我设置了这样的状态:

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

我把这个对象放到了 setAddress 中:

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

我想输出这样的数据:

address.street_number, address.street ...

但我没有定义。为什么?

3 个答案:

答案 0 :(得分:0)

要使用状态,根据您的用例,类似这样的事情可能会起作用:

...
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>)}
    </>
);

...

答案 1 :(得分:0)

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

那么,

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

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

是的,对于初始化状态,您应该使用对象,

像这样 -

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

答案 2 :(得分:0)

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

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]);