vue+element-ui el-dialog嵌套table组件，ref问题,toggleRowSelection的undefined

项目需求，返回数据的时候，el-dialog弹窗里面的table组件需要设置默认选中。

要设置选中，则要调用table组件默认的toggleRowSelection(row,true)方法，true默认选中。

问题：el-diaglog组件里面的table组件时自定义的组件。

<el-dialog title="选择用户"
               :width="dialogWidth"
               v-if="isDialog"
               :visible.sync="isDialog">
      <v-table ref="elTable"
               :data="resultData"
               :columns="columns"
               :checkbox="checkbox"
               :selectRow="selectRow"
               loading
               @handleCurrentChange="handleCurrentChange"
               @handleSelectionChange="handleSelectionChange">
      </v-table>
    </el-dialog>

这时候要设置默认选中

1、在v-table组件里面设置selectCheck方法。

<template>
  <div class="table-container">
    <el-table border
                  ref="multipleTable"
                  :data="data.records"
                  v-loading='$store.state.tableLoading'
                  @selection-change="handleSelectionChange">
          <el-table-column fixed
                           v-if="checkbox"
                           type="selection"
                           align="center"
                           width="50">
          </el-table-column>       

          <template v-for="(item, index) in columns">
            <slot :name='item.slot'
                  v-if='item.slot' />
            <component v-else-if="item.component"
                       :is="item.component"
                       :column="item"
                       :key="index" />

            <el-table-column :key="index"
                             v-bind="item"
                             v-else
                             align="center" />
          </template>
        </el-table>
  </div>
</template>

<script>
export default {
  name: 'v-table',
  props: {
    loading: {
      type: Boolean,
      default: false
    },
    checkbox: {
      type: Boolean,
      default: false
    },
    data: { // 父组件传递过来的table数据
      type: [Object, Array],
      default: () => { }
    },
    columns: {
      type: Array,
      default: () => []
    },
    height: {
      type: [String, Number],
      default: 0
    },
    selectRow: {  //父组件传递过来的要选中的行的id
      type: Array,
      default: null
    }
  },
  data () {
    return {
    }
  },
  created () {
  },
  mounted () {
  },
  methods: {
    selectCheck () {
      this.data.records.forEach(item => {
        for (let i in this.selectRow) {
          if (item.id === this.selectRow[i]) {
            this.$refs.multipleTable.toggleRowSelection(item, true)
          }
        }
      })
    },

    handleSelectionChange (val) {
      this.$emit('handleSelectionChange', val)
    }
  }
}
</script>
<style lang="scss" scoped>
</style>

2、父组件传递选中的行的id给子组件,父子组件传值，大家都知道就不多说了。

selectRow: []

3、父组件调用自组件的方法，在子组件上设置ref

这里在父组件调用子组件的selectCheck()方法

this.$refs.elTable.selectCheck()

注意，因为table组件在dialog弹框里，所以为了避免dialog显示时dom还没有加载完成，所以要使用this.$nextTick()

点击显示弹框的方法里：

this.isDialog = true
this.$nextTick(() => {
        this.$refs.elTable.selectCheck()
 })

4、获取表格中选中的行

handleSelectionChange (val) {
      this.values= val
    },