报错信息:

代码信息:
调用一个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的更多相关文章

  1. 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 ...

  2. 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". ...

  3. [Vue warn]: Invalid prop: type check failed for prop "percentage". Expected Number, got Null

    Vue组件报错 <ElProgress> at packages/progress/src/progress.vue 用了element组件 绑定数据时后端给我们传的参数为null,所以组 ...

  4. [VUE ERROR] Invalid prop: type check failed for prop "list". Expected Array, got Undefined

    错误原因: 子组件 props -> list 要求接收的数据类型是 Array, 然而实际接收到的是 Undefined. 子组件代码: props: { list: { type: Arra ...

  5. [Vue warn]: Invalid prop: type check failed for prop "fullscreen"

    fullscreen属性是Dialog弹窗中定义是否为全屏 Dialog的属性,element 官方文档中默认值是false ,于是加入是对其赋值 true,然后报了下面的错误: 解决办法:实际上并不 ...

  6. 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 ...

  7. vue中data中引用本地图片报错404

    首先说明vue-cli中assets和static两个文件的区别 1.assets在项目编译的过程中会被webpack处理理解为模块依赖,如果执行npm run dev或npm run build命令 ...

  8. 在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错误 ...

  9. Vue报错type check failed for prop

    在报错的'value'属性前面加:或者去掉:即可解决问题.

随机推荐

  1. python时间 time模块和datetime模块

    一.time模块 time模块中时间表现的格式主要有三种: a.timestamp时间戳,时间戳表示的是从1970年1月1日00:00:00开始按秒计算的偏移量 b.struct_time时间元组,共 ...

  2. 开始PHP,常量/变量与内存间的关系--传值

    一.常见的PHP代码嵌入式方式,与html结合 要注意:文件名后缀必须形如xxx.php否则html将无法解析 二.php脱离html代码独立工作,没有其他代码 不需要借助Apache工作,只需要ph ...

  3. wx小程序知识点(七)

    七.小程序提速与性能优化 参考大佬vicyao的文章 https://blog.csdn.net/wetest_tencent/article/details/61196522 (1)提高页面加载速度 ...

  4. inline元素导航栏案例

    练习一个超链接元素在文档流当中,a标签显示出来的inline这种元素的特性.我们可以用display来将它转换成inline-block类型,这样我们就可以设置它的高度,宽度和它的背景颜色等等特性了. ...

  5. ASE高级软件工程 第一周博客作业

    1.自我介绍 我叫姚顺,是来自哈尔滨工业大学计算机学院的一名大四本科生,专业方向计算机科学,目前在KC组实习.平时的业余时间主要用来打篮球,听音乐,跑步,当然还有游戏(划掉).之前的大学三年主要用来做 ...

  6. 51 Nod 1066 Bash游戏

    1066 Bash游戏  基准时间限制:1 秒 空间限制:131072 KB 分值: 0 难度:基础题  收藏  关注 有一堆石子共有N个.A B两个人轮流拿,A先拿.每次最少拿1颗,最多拿K颗,拿到 ...

  7. sh_04_列表排序

    sh_04_列表排序 name_list = ["zhangsan", "lisi", "wangwu", "wangxiaoer ...

  8. Fastdfs 单机安装 教程

    分布式存储 CentOS6.5虚拟机环境搭建FastDFS-5.0.5集群 详细的最新版fastdfs单机版搭建 分布式文件系统 - FastDFS 在64位CentOS 下配置安装部署

  9. [CSP-S模拟测试]:分组配对(倍增+二分)

    题目传送门(内部题108) 输入格式 输入文件第一行为两个正整数$n,M$. 接下来两行,第一行为$n$个正整数$a_1\sim a_n$,其中$a_i$表示编号为$i$的男生的实力值:第二行为$n$ ...

  10. 关于Spring3与Jdk8 遇到的问题ArrayIndexOutOfBoundsException:xxxxxx

    Spring 3不完全兼容JDK8. 需要升级到Spring 4才能使用Java 8 lambda表达式.