vue调用组件,组件回调给data中的数组赋值,报错Invalid prop type check failed for prop value. Expecte
报错信息:

代码信息:
调用一个tree组件,选择一些信息
<componentsTree ref="typeTreeComponent"
@treeCheck="treeCheck"
:isClearAllChecked=true
:defaultProps="defaultProps">
</componentsTree>
选择之后返回选中数据信息,并且在父组件中给data中的数组(type、typeName)赋值:
data: function () {
return {
dataForm: {
type: [],
typeName: []
}
}
},
回调方法执行:
treeCheck: function (a, b) {
let t = []
let tid = []
for (var i = 0; i < b['checkedNodes'].length; i++) {
t.push(b['checkedNodes'][i]['name'])
tid.push(b['checkedNodes'][i]['id'])
}
this.dataForm.typeName = [].concat(t)
this.dataForm.type = [].concat(tid)
},
在给type 和typeName 赋值的时候 ,报错
Invalid prop: type check failed for prop "value". Expected String, Number, got Array
解决方法:
重新定义两个变量:
AtypeName: '',
Atype: '',
回调函数的时候给这两个变量赋值:
treeCheck: function (a, b) {
let t = []
let tid = []
for (var i = 0; i < b['checkedNodes'].length; i++) {
// if (b['checkedNodes'][i]['children'].length > 0) continue
t.push(b['checkedNodes'][i]['name'])
tid.push(b['checkedNodes'][i]['id'])
}
this.AtypeName = t.join(',')
this.Atype = tid.join(',')
},
监听这两个值得变化:
watch: {
AtypeName (val) {
this.dataForm.typeName = val.split(',')
this.dataForm.type = this.Atype.split(',')
console.log(this.dataForm)
}
}
变化时,给type 和typeName 赋值
这是折中的解决方案,不熟悉vue不清楚报错原因,先这样解决吧
vue调用组件,组件回调给data中的数组赋值,报错Invalid prop type check failed for prop value. Expecte的更多相关文章
- Vue报错之"[Vue warn]: Invalid prop: type check failed for prop "jingzinum". Expected Number with value NaN, got String with value "fuNum"."
一.报错截图 [Vue warn]: Invalid prop: type check failed for prop "jingzinum". Expected Number w ...
- vue.esm.js?efeb:628 [Vue warn]: Invalid prop: type check failed for prop "defaultActive". Expected String with value "0", got Number with value 0.
vue.esm.js?efeb:628 [Vue warn]: Invalid prop: type check failed for prop "defaultActive". ...
- [Vue warn]: Invalid prop: type check failed for prop "percentage". Expected Number, got Null
Vue组件报错 <ElProgress> at packages/progress/src/progress.vue 用了element组件 绑定数据时后端给我们传的参数为null,所以组 ...
- [VUE ERROR] Invalid prop: type check failed for prop "list". Expected Array, got Undefined
错误原因: 子组件 props -> list 要求接收的数据类型是 Array, 然而实际接收到的是 Undefined. 子组件代码: props: { list: { type: Arra ...
- [Vue warn]: Invalid prop: type check failed for prop "fullscreen"
fullscreen属性是Dialog弹窗中定义是否为全屏 Dialog的属性,element 官方文档中默认值是false ,于是加入是对其赋值 true,然后报了下面的错误: 解决办法:实际上并不 ...
- Vue报错 type check failed for prop “xxx“. Expected String with value “xx“,got Number with value ‘xx‘
vue报错 [Vue warn]: Invalid prop: type check failed for prop "name". Expected String with ...
- vue中data中引用本地图片报错404
首先说明vue-cli中assets和static两个文件的区别 1.assets在项目编译的过程中会被webpack处理理解为模块依赖,如果执行npm run dev或npm run build命令 ...
- 在eclipse中新建java问题报错:The type XXX cannot be resolved. It is indirectly referenced from required .class files
在Eclipse中遇到The type XXX cannot be resolved. It is indirectly referenced from required .class files错误 ...
- Vue报错type check failed for prop
在报错的'value'属性前面加:或者去掉:即可解决问题.
随机推荐
- 解决supervisord启动问题
作者:StormerX链接:https://www.jianshu.com/p/d8901ce4712b来源:简书简书著作权归作者所有,任何形式的转载都请联系作者获得授权并注明出处. $ superv ...
- Qt:路径问题小结
在做Qt项目的时候,我们难免遇到到文件路径问题. 如QFile file("text.txt")加载不成功.QPixmap("../text.png") 加载图 ...
- 通用DES加密解密方法
/// <summary> /// DES加密方法 /// </summary> /// <param name="strPlain">明文&l ...
- pgadmin4 csrf错误导致docker-compose postgres服务下线
docker-compse up 启动的前台服务, 过一会就自动停止 检查半天,发现是pgadmin4没安装正确不断报400 和 csrf error 然后pgadmin4为啥报这个, 因为pytho ...
- linux环境下写C++操作mysql(一)
/***************** connect.cpp g++ connect.cpp -o connect -I /usr/include/mysql/ -L /usr/lib/mysql/ ...
- 安装MongoDB到CentOS 6
MongoDB是一个面向海量文档存数据动态存储的NoSQL型数据库.是一个除了用于关系型数据库如MySQL,PostgreSQL数据库表格的格式,和微软SQL以外的一种数据模型存储形式.他的功能包括了 ...
- BZOJ 2655 calc (组合计数、DP、多项式、拉格朗日插值)
题目链接 https://www.lydsy.com/JudgeOnline/problem.php?id=2655 题解 据说有一种神仙容斥做法,但我不会. 以及貌似网上大多数人的dp和我的做法都不 ...
- [VIJOS2053][SDOI2019]世界地图:最小生成树+虚树
分析 可以发现第一列和最后一列永远不会被删除,于是我们可以想到维护前后缀最小生成树,但是直接维护的话显然时间空间两爆炸.(通过上网找题解)可以发现我们关心的只是最左边和最右边两列,而不关心内部的连边情 ...
- Spring Boot教程(二十八)通过JdbcTemplate编写数据访问
数据源配置 在我们访问数据库的时候,需要先配置一个数据源,下面分别介绍一下几种不同的数据库配置方式. 首先,为了连接数据库需要引入jdbc支持,在pom.xml中引入如下配置: <depende ...
- C++入门经典-例6.1-一维数组元素
1:代码如下: // 6.1.cpp : 定义控制台应用程序的入口点. // #include "stdafx.h" #include <iostream> using ...