reactjs - React 未捕获类型错误 : cannot read property x of undefined

标签 reactjs use-effect use-state

我有一个组件,它通过react router Link组件从父组件获取数据作为 Prop ,如下所示:

<Link to={{pathname: "/cv", state:cvData }}>Next</Link>

“/cv”路径中的 CV 组件获得该状态。但在 CV 组件的 JSX 中,我无法访问该状态下的数据。代码是这样的:

const [cvData, setCvData] = useState(props.state)
useEffect(() => {
    setCvData(props.cvData)
    console.log(cvData)
}, [])

console.log 的输出首先是未定义,然后是数据。但即使它记录了正确的数据,JSX 部分也会抛出“无法读取未定义的属性 x”的错误。

最佳答案

这是因为在开始的某个时刻你的数据首先是未定义的,你可以在使用它之前添加一个简单的检查条件,例如:

return(
  <div>
    { cvData && cvData.x ? <div>display your cvData</div> : null }
  </div>
)

关于reactjs - React 未捕获类型错误 : cannot read property x of undefined,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/65871621/

相关文章:

reactjs - useState加载在异步之前不更新

reactjs - 从 for 循环中的多个连续异步调用调用多个 `setState` Hook

java - Java Spring Boot 中的服务器端渲染 React

javascript - Material-UI Dialog 如何在对话框的右上角放置关闭按钮

reactjs - React Hooks useCallback 依赖无限循环

javascript - 组件本身是否应该防止不必要的 useEffect() 调用?

javascript - 如何在formdata中追加 boolean 类型值?

javascript - ReactJS-浏览器验证错误: no_account_error: No account object provided to acquireTokenSilent and no active account has been set

reactjs - 为什么在 useEffect 的依赖数组中需要 history