[Vue warn]:Invalid prop: type check failed.Expected Object,got Array父子组件传值 用空对象或空字符串接收

最新推荐文章于 2023-12-28 11:21:09 发布
最新推荐文章于 2023-12-28 11:21:09 发布
阅读量630 收藏
点赞数 1
分类专栏： 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_37767455/article/details/107898364
版权

在这里插入图片描述

上图中后台Controller中的data里面数据是个list,但前台打印response.data.data却是个Object类型，原来，typeof 的运算数对对象、数组和null，它返回的是“object”，如下图：

在这里插入图片描述
在这里插入图片描述
下图中phoneBooks定义为空字符串：
在这里插入图片描述
然后下图中子组件的props用空对象接收：
在这里插入图片描述
当时我使用Object接收，就会报这个错：
在这里插入图片描述

Take^that
关注
  • 1
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
[Vue warn]: Invalid prop: type check failed for prop "disabled". Expected Boolean, got String.
郭宝的博客
10-08 7万+
问题： 大致意思是prop期待传入布尔值，而你传入的却是字符串，类型错误。 解决思路： 1、首先针对该错误信息可以去GbComponentUploadDialog.vue文件中查找disabled关键字 2、然后通过查看对应的Element官网得知，设置输入框组件禁止输入的正确写法是 :disabled="true" ，而代码中少写了冒号，加上即可。 更...
解决Invalid prop: type check failed for prop “model“. Expected Object, got Array问题
世间万物皆不如你
06-28 3531
上面报错的意思是需要的是对象，实际得到的是数组 改正：把数组类型改为对象就可以了获取数据的代码为
[Vue warn]: Invalid prop: type check failed for prop “value“. Expected
m0_51152244的博客
07-28 7779
解决： [Vue warn]: Invalid prop: type check failed for prop "value". Expected String, Number, got Array
Vue报错：Invalid prop: type check failed for prop “roleList“. Expected Object, got Array 解决方法
cdtaogang's blog
08-10 4965
根据以上可以看到我们在父组件向子组件传递的 roleList 变量的类型是数组，而在子组件中 roleList 变量的类型是对象，先看看父组件和子组件传递的代码，这里注意看两个组件之间通过 Props 属性传值所定义的类型。，这就是导致错误的原因，修改 Props 属性的 roleList 变量的类型和默认值即可。问题解决，所以大家在写代码的时候特别是传递参数时，注意两边参数定义的类型是否一致！在子组件中我们的期望是一个对象，而你父组件中给我传递了一个数组。
Invalid prop: type check failed
圣人男的博客
03-16 569
错误出处： 1.子组件 export default { name: 'EditApp', props: { form: { type: Object, required: true, default: Object } } } 2.父组件 export default { name: 'Home', c...
前端vue：解决Invalid prop: type check failed for prop “model“. Expected Object, got Array问题
热门推荐
江咏之
09-10 8万+
前台页面报错“Invalid prop: type check failed for prop “model”. Expected Object, got Array ” 错误是：期望对象，得到的是数组 从后台获取的数据是数组类型，需要把它改为Object 第一种情况： 组件传值 1、父组件 2、子组件 3、报错提示 改正 第二种情况： 获取数据的代码为 this.update = response.data; 改为： this.update = resp
2020-web前端-vue项目出错-[Vue warn]: Invalid prop: custom validator check failed for prop “index”.
01-08
1.在写循环的时候遇见这个的 原创文章 96获赞 50访问量 6万+ 关注 私信 展开阅读全文 作者：itwangyang520
Vben Admin [Vue warn]: Invalid prop: type check failed for prop “api“. Expected Function, got Null
qq_51536454的博客
12-28 993
Vben Admin 如何解决警告 [Vue warn]: Invalid prop: type check failed for prop "api". Expected Function, got Null
vue表单验证中 Invalid prop: type check failed for prop “model“. Expected Object, got String with value “l
weixin_43413645的博客
04-19 4033
4/19 在写vue项目注册页面中rules规则的时候，反复验证prop和rules中值相同的情况下，运行一直产生报错 <template> <div> <div id="register" class="box" > <h3>注册登录页面</h3> <el-form ref="ruleform" :rules="rules" model="loginForm" label-width="20%"> .
Vue warn]: Invalid prop: type check failed for prop "rules". Expected Object, got Array
最新发布
08-24
当你在Vue.js项目中遇到这个警告`Vue warn]: Invalid prop: type check failed for prop "rules". Expected Object, got Array`，这意味着你在尝试将一个Array类型的值传递给组件的一个prop（属性），而该prop期望的...
验证规则时出现的问题：Invalid prop: type check failed for prop “rules“. Expected Object, got String with value
zhangyysp的博客
12-23 1万+
验证规则对象在标签中的写法是:rules="formDataRules" 前面的冒号绑定不能丢不然会出现上面的问题 在data中定义： formDataRules:{ goods_name: [ { required: true, message: '请输入商品名称', trigger: 'blur' }], goods_price:[ { required: true, message: '请输入商品价格', trigger:
解决Vue报错解决Invalid prop: type check failed for prop “model“. Expected Object, got Array的问题
weixin_51641169的博客
08-11 2万+
解决Invalid prop: type check failed for prop “model“. Expected Object, got Array的问题
Vue报错 Invalid prop: type check failed for prop “model“. Expected Object, got Array
songjuntao8的专栏
01-30 3801
前台页面报错“Invalid prop: type check failed for prop “model”. Expected Object, got Array ” 错误：期望对象，得到的是数组 从后台获取的数据是List类型，需要把它改为Object this.form=[] 改为 this.form={} 或者：response.data 改为：response.data[0]; ...
vue elementui type check failed和表格序号问题
weixin_42094764的博客
05-02 175
控制台报错： Invalid prop: type check failed for prop “prop”. Expected String with value “0”, got Number with value 0. 原因:预期接收的是字符串，数据里面是数字 解决办法,在这个属性后面加上 + ‘’,把数字转为字符串 element 表格插件，如何设置序号 <el-table-column label="ID" width="55"> <template slot-sc
Invalid prop: type check failed for prop "centered". Expected Boolean, got String with value "true"
酸酸酱的博客
04-01 2万+
使用Vue + antDesign的时候，出现这个错误 我需要使用的antDesign的组件是modal，官网api介绍为 代码中书写： <a-modal title="手动添加展位" v-model="visible" @ok="hideModal" okText="确认添加" width="600" center...
解决Invalid prop: type check failed for prop “data“. Expected Array, got Object 报错
奥特蛋的博客
02-15 1万+
Invalid prop: type check failed for prop “data”. Expected Array, got Object 报错
type check failed for prop “model“. Expected Object, got Array
u013437812的博客
05-15 8217
Invalid prop: type check failed for prop “model”. Expected Object, got Array (期望对象，得到的是数组），因为model绑定的是对象，当用它来绑定数组时会报这个错误 解决方法1：直接去掉:model=“form”，不需要校验。 代码如下（示例）： <el-form ref="form" label-width="100px"> <el-form-item label="设备名称">
Expected Array got Object
SBTOC的博客
05-19 5371
Invalid prop: type check failed for prop “data”. Expected Array, got Object 简单来说，就是你传参的类型错了。 需要传递一个对象类型，但是传递的确实数组。
3.常见报错-[Vue warn]: Invalid prop: type check failed for prop “data“. Expected Array, got Object
weixin_55181759的博客
05-18 564
[Vue warn]: Invalid prop: type check failed for prop “data”. Expected Array, got Object vue报错原因,其实就是"data"数据要求是数组,但是实际传过来的是对象,所以需要进行一个转换; <!--courseInfo应该是数组,实际现在绑定的是对象,报错--> <el-table :data="courseInfo"> <el-table-column prop="cou
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值