解决 Vue 中 'Cannot read properties of undefined (reading 'setCheckedKeys')' 错误

解决 Vue 中 'Cannot read properties of undefined (reading 'setCheckedKeys')' 错误

在 Vue 中使用 ElForm 组件时，你可能遇到过调用 setCheckedKeys 方法出现 'Cannot read properties of undefined (reading 'setCheckedKeys')' 错误。这个错误通常是由于 treeRef.value 为 undefined 导致无法调用 setCheckedKeys 方法。

以下两种方法可以解决这个问题：

1. 确保在调用 resetChecked 函数之前，treeRef 已经被正确地赋值为一个 ElForm 实例。

const treeRef = ref<ElForm>()

// 在某个时机给 treeRef 赋值
treeRef.value = ...

const resetChecked = () => {
     treeRef.value?.setCheckedKeys([], false)
}

2. 使用可选链操作符 ?. 来避免访问 undefined 的属性。

const treeRef = ref<ElForm>()

const resetChecked = () => {
     treeRef.value?.setCheckedKeys([], false)
}

通过以上修改，当 treeRef 未定义时，调用 resetChecked 函数不会报错，而是会直接退出函数。

总结

出现 'Cannot read properties of undefined (reading 'setCheckedKeys')' 错误通常是由于引用未被正确赋值。可以通过确保引用被正确赋值或使用可选链操作符来解决此问题。