Uncaught (in promise) TypeError: Cannot read properties of undefined (reading ‘toggleRowSelection‘)

Element UI 的 Table 表格默认多选报错

该报错是由Table组件还没有完成页面渲染导致无法调用Ref 的toggleRowSelection方法所引发的
通常我们可以加一个nextTick或者setTimeout解决。

const multipleTableRef = ref() //绑定在Table上的Ref
const toggleSelection = rows => {
  rows.forEach(row => {
    multipleTableRef.value!.toggleRowSelection(row, true)
  })
}

onMounted(() => {
  nextTick(() => {
    toggleSelection(tableData.value)
  })
})

但是还有一种特殊情况就是Table写在了Dialog或者Drawer容器里，这样即便是页面完成渲染，但是因为弹窗或抽屉并没有展示，Table组件也就无法完成渲染仍然是无法调用Ref的toggleRowSelection方法。
现在导致问题的根源找到了，因此只需要把初始化默认多选的代码挪到Dialog或Drawer的open事件里去执行即可

const visible = ref(false)
const openDialog = () => {
  visible.value = true
  nextTick(() => {
    toggleSelection(tableData.value)
  })
}

 <el-dialog v-model="visible" @open="openDialog">
      <!-- Table相关代码 -->
      <!-- ...... -->
 </el-dialog>