el-table导致TypeError: this.$el.querySelectorAll is not a function
码农天地 -在使用Vue的过程中报以下错误,特此记录
报错截图vue.runtime.esm.js?2b0e:1888 TypeError: data.reduce is not a function
at Proxy.render (table.js?ad41:2558)
at VueComponent.Vue._render (vue.runtime.esm.js?2b0e:3548)
at VueComponent.updateComponent (vue.runtime.esm.js?2b0e:4066)
at Watcher.get (vue.runtime.esm.js?2b0e:4479)
at Watcher.run (vue.runtime.esm.js?2b0e:4554)
at flushSchedulerQueue (vue.runtime.esm.js?2b0e:4310)
at Array.eval (vue.runtime.esm.js?2b0e:1980)
at flushCallbacks (vue.runtime.esm.js?2b0e:1906)
TypeError: this.$el.querySelectorAll is not a function
at VueComponent.onColumnsChange (table.js?ad41:2475)
at VueComponent.updated (table.js?ad41:2467)
at invokeWithErrorHandling (vue.runtime.esm.js?2b0e:1854)
at callHook (vue.runtime.esm.js?2b0e:4219)
at callUpdatedHooks (vue.runtime.esm.js?2b0e:4351)
at flushSchedulerQueue (vue.runtime.esm.js?2b0e:4336)
at Array.eval (vue.runtime.esm.js?2b0e:1980)
at flushCallbacks (vue.runtime.esm.js?2b0e:1906)
报错位置判断绑定:data
后报错,所以可能和rightList
有关
// Rights.vue
<!-- 表格区域 -->
<el-table :data="rightList" stripe>
</el-table>
发现在定义rightList
时初始化为一个空对象
// Rights.vue
<script>
export default {
data() {
return {
// 权限列表数据,就是这里导致了报错
rightList: {},
}
},
}
</script>
解决element-ui中el-table中要求data类型为数组类型
所以修改为数组即可,修改后代码如下
// Rights.vue
<script>
export default {
data() {
return {
// 权限列表数据,就是这里导致了报错,改为[]类型就不会报错了
rightList: [],
}
},
}
</script>
特别申明:本文内容来源网络,版权归原作者所有,如有侵权请立即与我们联系(cy198701067573@163.com),我们将及时处理。
下一篇: 微信中Video兼容问题