表单和下拉选择树TreeSelec联合使用报错：Cannot set property ‘isSelect‘ of null

做vue项目的时候遇到这么一个场景，有一个表格，且表格中”事件类型“那一列的属性值，可更改。事件类型那一块是一个下拉树选择框，如下所示：

 一般这样的功能都是通过插槽实现的，部分代码如下：

<el-table-column
    prop="recordType"
    label="事件类型"
    align="center"
    width="290"
    sortable>
        <template slot-scope="scope">
            <el-tree-select
                :clearable="true"
                v-model="scope.row.recordType"
                :data="recordClassList"
                placeholder="请选择事件类型"
                :expand-on-click-node="true"
                :default-expand-all="false">
            </el-tree-select>
        </template>
</el-table-column>

其中，recordClassList是TreeSelect 下拉树选择框绑定的数据。

表格加载后，报错如下：

我一开始以为，表格中获取不到值，所以在表格中输出了一下：

发现表格实际是可以获取到值的，但是选择框中不显示。后续请教了一下师父，才恍然大悟。

下拉树的数据和表格的数据都是异步的，若是先渲染表格中的数据，再渲染下拉树的数据，肯定会报错，因为下拉树中没有值。所以应该先把下拉树的数据拿到之后，再去渲染表格中的数据。结果就可以了：

一定要注意这一点，当使用类似下拉框的时候，若是下拉框数据是从后台获取的，在使用下拉框前，要确保，这个下拉框数据已经从后台获取到了，不然就会像我这样跳坑。

这个坑，坑就坑在，你后续查看的时候，下拉框是有数据的，所以，你就会是认为是选择框数据没获取到，或者下拉框封装的有问题。

实际却是，下拉框数据渲染在表格渲染之后，即：使用下拉框的那一刻，下拉框中是没有数据，即便后面有数据了，也起不到作用了。