elementUI?checkBox報錯Cannot read property 'length' of undefined解決
在使用el-checkbox時遇上這樣的錯誤
TypeError: Cannot read property 'length' of undefined
at VueComponent.isLimitDisabled (element-ui.common.js?ccbf:6452)
at Watcher.get (vue.esm.js?efeb:4482)
at Watcher.evaluate (vue.esm.js?efeb:4587)
at VueComponent.computedGetter [as isLimitDisabled] (vue.esm.js?efeb:4839)
at VueComponent.isDisabled (element-ui.common.js?ccbf:6455)
at Watcher.get (vue.esm.js?efeb:4482)
at Watcher.evaluate (vue.esm.js?efeb:4587)
at VueComponent.computedGetter [as isDisabled] (vue.esm.js?efeb:4839)
at Object.get (vue.esm.js?efeb:2104)
at Proxy.checkboxvue_type_template_id_d0387074_render (element-ui.common.js?ccbf:6161)
在template中，我的這樣綁定的：
<!-- 多選 -->
<template>
<el-checkbox-group v-model="examData[current].answer">
<el-checkbox
:label="item"
v-for="(item, index) in examData[current].tmDa"
@change="examData[current].complete = true">
<strong>{{String.fromCharCode('A'.charCodeAt(0) + index)}}</strong>
<span>{{item}}</span>
</el-checkbox>
</el-checkbox-group>
</template>在data選項中：
data() {
return {
examData: [
{
answer: [],
title: '問題，問題，問題？',
options: [
'答案1',
'答案2',
'答案3',
'答案4',
],
complete: false,
},
]
}
}
報錯的原因：
在data中其實是我們的靜態(tài)數(shù)據(jù)，從后端拿到的數(shù)據(jù)賦值給examData，發(fā)現(xiàn)examData里少了answer 的字段
我們必須給數(shù)據(jù)添加answer字段并給類型為數(shù)組
以上就是elementUI checkBox報錯Cannot read property ‘length‘ of undefined解決的詳細內(nèi)容，更多關(guān)于elementUI checkBox報錯的資料請關(guān)注腳本之家其它相關(guān)文章！
相關(guān)文章
vue element-ui el-cascader級聯(lián)選擇器數(shù)據(jù)回顯的兩種實現(xiàn)方法
這篇文章主要介紹了vue element-ui el-cascader級聯(lián)選擇器數(shù)據(jù)回顯的兩種實現(xiàn)方法，具有很好的參考價值，希望對大家有所幫助。2023-07-07
最近學(xué)習(xí)了Vue3,利用vue3做了個好玩的項目,所以下面這篇文章主要給大家介紹了關(guān)于如何利用Vue3模仿Windows窗口的相關(guān)資料,文中通過實例代碼介紹的非常詳細,需要的朋友可以參考下2022-04-04
vue項目設(shè)置活性字體過程(自適應(yīng)字體大小)
這篇文章主要介紹了vue項目設(shè)置活性字體過程(自適應(yīng)字體大小)，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-09-09
Vue利用History記錄上一頁面的數(shù)據(jù)方法實例
這篇文章主要給大家介紹了關(guān)于Vue利用History記錄上一頁面的數(shù)據(jù)的相關(guān)資料，文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2018-11-11
這篇文章主要介紹了ant-design-vue中tree增刪改的操作方法,本文給大家介紹的非常詳細，對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值，需要的朋友可以參考下2020-11-11
這篇文章主要介紹了mpvue+vant app搭建微信小程序的方法步驟，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2019-02-02
vue實現(xiàn)頁面渲染時候執(zhí)行某需求的示例代碼
本文主要介紹了vue實現(xiàn)頁面渲染時候執(zhí)行某需求,文中通過示例代碼介紹的非常詳細,對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2024-05-05
路由守衛(wèi)（Route?Guards）是?Vue?Router?的一個功能,它允許我們在路由發(fā)生之前執(zhí)行邏輯判斷,這篇文章主要為大家介紹了Vue中路由守衛(wèi)的具體應(yīng)用,需要的可以了解下2024-03-03
這篇文章主要介紹了Vue組件的繼承用法,本文通過實例代碼案例講解給大家介紹的非常詳細，需要的朋友可以參考下2022-08-08
Vue3中的Teleport與Portal的區(qū)別分析
在現(xiàn)代前端開發(fā)中,特別是使用Vue.js進行構(gòu)建時,開發(fā)者常常面臨著如何更有效地管理DOM結(jié)構(gòu)與組件之間的關(guān)系的問題,Vue 3引入了兩個頗具魅力的概念——Teleport和Portal,本文將深入探討這兩者的不同之處,需要的朋友可以參考下2025-01-01