Vue FireStore 反应式键分配 - 对象可能是“未定义”

Posted 2023-02-22

【中文标题】Vue FireStore 反应式键分配 - 对象可能是“未定义”

【英文标题】：Vue FireStore Reactive Key Assignment - Object is possibly 'undefined'

【发布时间】：2021-09-14 02:37:10

【问题描述】：

我正在尝试将由 props 转发的 FireStore data() 分配给 reactive() 代理对象，但收到以下错误：

Object is possibly 'undefined'.
(property) fireStoreData: Record<string, any> | undefined

我希望使用 forEach 循环而不是直接赋值，即 (pageForm.name = props.fireStoreData?.name) 来最小化代码。

props: 
    fireStoreData: Object,

...
setup(props)
    ...
    const pageForm:  [key: string]: any  = reactive(
        name: '',
        address: '',
        ...
    )

    onMounted(() => 
        Object.keys(pageForm).forEach(key => 
            if(key in props.fireStoreData)                  // <-- error found here
                pageForm[key] = props.fireStoreData[key]    // <-- and here
            )
        )
    )
    ...

【问题讨论】：

@Dharmaraj 不幸的是，这不起作用。

【参考方案1】：

问题在于，您假设的代码中还不需要 fireStoreData 属性。

尝试：

props: 
    fireStoreData: 
        required: true,
        type: Object
    

如果您不希望需要该道具，则始终可以检查它是否已定义并添加观察者以查找更改。

另外，别忘了道具可以改变价值。

//在手机上，稍后在电脑上格式化

【讨论】：

效果很好。谢谢你。如果您不介意，请尝试看看这个问题...***.com/questions/68203084/…

@RyanPrentiss 对链接问题的回答是正确的。您实际上需要将 emit 作为 setup 函数的参数才能访问它（不同于 vue2）

嗯，这很尴尬。我没有注意到有人回答了它。大声笑