[Solved] Vue Error: Error in render: “TypeError: Cannot read property ‘length‘ of undefined“

Vue reports error in render: “typeerror: cannot read property ‘length’ of undefined“

Reason: there is undefined in the (list) attribute of El table, and all columns can be judged by adding a V-IF

<el-table-column label="数据库" width="500px">
                    <template slot="header">
                      <el-button
                        @click="counterElection('主键', 'sqlOpt')"
                        size="small"
                        type="default"
                        >主键
                      </el-button>
                      <el-button
                        @click="counterElection('非空', 'sqlOpt')"
                        size="small"
                        type="default"
                        >非空
                      </el-button>
                      <el-button
                        @click="counterElection('唯一', 'sqlOpt')"
                        size="small"
                        type="default"
                        >唯一
                      </el-button>
                      <el-button
                        @click="counterElection('索引', 'sqlOpt')"
                        size="small"
                        type="default"
                        >索引
                      </el-button>
                      <el-button
                        @click="counterElection('忽略', 'sqlOpt')"
                        size="small"
                        type="default"
                        >忽略
                      </el-button>
                      <el-button
                        @click="counterElection('自增', 'sqlOpt')"
                        size="small"
                        type="default"
                        >自增
                      </el-button>
                    </template>
                    <template slot-scope="scope">
                      <el-checkbox-group
                        v-if="
                          scope.row !== undefined &&
                          scope.row.sqlOpt !== undefined
                        "
                        v-model="scope.row.sqlOpt"
                      >
                        <el-checkbox label="主键"></el-checkbox>
                        <el-checkbox label="非空"></el-checkbox>
                        <el-checkbox label="唯一"></el-checkbox>
                        <el-checkbox label="索引"></el-checkbox>
                        <el-checkbox label="忽略"></el-checkbox>
                        <el-checkbox label="自增"></el-checkbox>
                      </el-checkbox-group>
                    </template>
                  </el-table-column>

Similar Posts: