导出组件React-本机函数前console.log时未定义变量

zlwx9yxi 于 2023-03-19 发布在 React

关注(0)|答案(2)|浏览(91)

问题是：
我有一个全局变量（在componentA定义之外），其名称为：字符串为例，我需要赋值后，从后端取得它在useEffect []，并使用它之前，该组件被导出，但当时的变量是未定义的，有什么办法可以做到这一点或类似的事情？
这是一个代码示例

import React from 'react'

let name: string

const ComponentA = () => {
 useEffect(() => {
  fetchName()
 }, [])

 const fechName = async () => {
  const _name = await backendService.getName()
  name = _name
 }

 return (
  <>Anything</>
 )
}

console.log("name: ", name) // getting undefined

export default ComponentA

编辑：问题是，我正在实现Codepush，并且必须在导出组件时应用，如下所示：export default CodePush({option: name})(ComponentA)，所以我想动态设置选项属性，从后端获取它

react-native

来源：https://stackoverflow.com/questions/75772151/variable-undefined-when-console-log-before-export-component-react-native-functio

2条答案

按热度按时间

carvr3hs1#

看起来像是将name赋值给它自己，但由于它是undefined，因此将始终保持未定义状态。

const fechName = async () => {
  const _name = await backendService.getName()
  name = _name
 }

编辑：顺便说一句，即使进行了此更改，您仍然会在console.log中看到undefined，因为console.log语句是在fetchName函数中的name变量赋值之前执行的。请尝试在name赋值之后将console.log移到fetchName中。

赞(0）回复(0）举报 2023-03-19

laawzig22#

看起来像是XY problem，重点应该是如何动态创建组件，您可以执行以下操作：

export async function createComponentA() {
    const name = await getOptionName()

    return CodePush({option: name})(ComponentA)
}

返回的组件可能需要useMemo以避免重新获取太多次

赞(0）回复(0）举报 2023-03-19

我来回答

导出组件React-本机函数前console.log时未定义变量

2条答案

相关问题

热门标签

最新问答