vue开发常见却难以定位的报错
故而,将以上代码中的 selectValue: undefined, 修改为 selectValue: [ ],即可解决报错。由于元素为v-if判断为不渲染的元素,而我们又在后面要获取到这个元素,所以这里应该。为 应该 获取到,但实际没获取到 或 获取到的值与预期不符。将 v-if 改为 v-show。据elementUI官网可知:为。的值为当前选中值所组成的。属性即可启用多选,此时。
·
1.Error in mounted hook: “TypeError: Failed to execute ‘observe’ on ‘ResizeObserver’: parameter 1 is not of type ‘Element’.”
为 应该 获取到,但实际没获取到 或 获取到的值与预期不符。
示例
case 1:应该获取到值但实际没获取到
<!-- 报错代码 -->
<div v-if="showDiv" class="info" >
<useInfo ref="useInfo" :currentInfo="currentInfo" />
</div>
export default {
data() {
return {
showDiv: false,
}
}
mounted() {
this.getInfo();
},
methods: {
getInfo() {
// 此处应该获取到元素“info”,但由于元素为v-if判断为不渲染的元素,故而报错
let info = document.querySelector('.info');
}
}
}
由于元素为v-if判断为不渲染的元素,而我们又在后面要获取到这个元素,所以这里应该将 v-if 改为 v-show 。
case 2:获取到的值与实际不符
<!-- 报错代码 -->
<template>
<el-select v-model="selectValue" multiple placeholder="请选择">
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</template>
<script>
export default {
data() {
return {
selectValue: undefined,
options: [{
value: '选项1',
label: '黄金糕'
}, {
value: '选项2',
label: '双皮奶'
}],
}
}
}
</script>
据elementUI官网可知:为el-select
设置multiple
属性即可启用多选,此时v-model
的值为当前选中值所组成的数组。故而,将以上代码中的 selectValue: undefined, 修改为 selectValue: [ ],即可解决报错。
更多推荐
已为社区贡献1条内容
所有评论(0)