vue props default Array或是Object的正确写法说明

1、错误写法

demo:{
 type:Array,
 default:[]
}

eslint语法报错:

Invalid default value for prop “demo”: Props with type Object/Array must use a factory function to return the default value.

2、正确的写法应该是:

demo: {
 type: Array,
 default: function () {
  return []
 }
}

或是用箭头函数:

demo: {
 type: Array,
 default: () => []
}

3、对象的箭头函数写法:

demoObj: {
 type: Object,
 default: () => ({})
}

或是常规

demoObj: {
type: Object,
default: function () {
return {}
}
}

错误的写法

demoObj: () => {}

补充知识:vue 传参props里面为什么要带type,还有default?

这个是子组件啦 ,写type的意思是swiperDate传过来的数据类型是数组,default就是表示不传默认返回的[ ],空数组.

这种就是表示传的数据类型是number,不传默认是0。

以上这篇vue props default Array或是Object的正确写法说明就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持我们。

(0)

相关推荐

  • Vue props中Object和Array设置默认值操作

    我就废话不多说,看代码吧~ seller: { type: Object, default() { return {} } } seller: { type: Object, default: function () { return {} } } 当父组件没有传这个值或者值是空时,输出的话,返回: 下面这种是错误的 seller: { type: Object, default: () => {} } 当父组件没有传这个值或者值是空时,输出的话,这时是返回underfind,在template

  • 详解Vue内部怎样处理props选项的多种写法

    开发过程中,props 的使用有两种写法: // 字符串数组写法 const subComponent = { props: ['name'] } // 对象写法 const subComponent = { props: { name: { type: String, default: 'Kobe Bryant' } } } Vue在内部会对 props 选项进行处理,无论开发时使用了哪种语法,Vue都会将其规范化为对象的形式.具体规范方式见Vue源码src/core/util/options

  • 解决vue组件props传值对象获取不到的问题

    先说问题,父组件利用props向子组件传值,浏览器 console 有这个值,但是获取不到内部的属性,困了我3个小时,真的** personal console 以下为原代码 1.home.vue(父组件)--personal是被传的参数 <!--子组件--> <form-picker class="form-picker" :personal="personal" > </form-picker> export default

  • Vue props用法详解(小结)

    Vue props用法详解 组件接受的选项之一 props 是 Vue 中非常重要的一个选项.父子组件的关系可以总结为: props down, events up 父组件通过 props 向下传递数据给子组件:子组件通过 events 给父组件发送消息. 父子级组件 比如我们需要创建两个组件 parent 和 child.需要保证每个组件可以在相对隔离的环境中书写,这样也能提高组件的可维护性. 这里我们先定义父子两个组件和一个 Vue 对象: var childNode = { templat

  • vue props default Array或是Object的正确写法说明

    1.错误写法 demo:{ type:Array, default:[] } eslint语法报错: Invalid default value for prop "demo": Props with type Object/Array must use a factory function to return the default value. 2.正确的写法应该是: demo: { type: Array, default: function () { return [] } }

  • 解决vue props传Array/Object类型值,子组件报错的情况

    问题: Props with type Object/Array must use a factory function to return the default value. 1.在vue中如果当在父组件通过props传Array/Object类型值给子组件的时候 2.如果子组件的props接收default为 ,如下 报错 原因:props default 数组/对象的默认值应当由一个工厂函数返回 解决: 补充知识:vue的props如何传多个参数 vue父作用域将数据传到子组件通过pro

  • vue props 一次传多个值实例

    数组: <custom-element :whatever="[...array]"></custom-element> 对象: <custom-element :whatever="{...obj}"></custom-element> 或者: <custom-element v-bind="obj" </custom-element> 子组件: <ul class=&qu

  • vue - props 声明数组和对象操作

    我就废话不多说了,大家还是直接看代码吧~ props: { array: { type: Array, default () { return [] } }, object: { type: Object, default () { return {} } } } 补充知识:Vue项目中,要保证某个部分的高度,应该怎么设置 看代码吧~ .icons overflow: hidden height: 0 padding-bottom: 50% background: green 以上这篇vue -

  • vue props type设置多个类型

    目录 props type设置多个类型 vue定义props props type设置多个类型 props: { value: { // vue props type设置多个类型 type: Number | null, required: true }, articleId: { type: [Number, String, Object], required: true } }, vue定义props props: { num: { type: [Number, String], //支持多

  • vue props对象validator自定义函数实例

    validator自定义函数实例 props: { // 基础的类型检查 (`null` 匹配任何类型) propA: Number, // 多个可能的类型 propB: [String, Number], // 必填的字符串 propC: { type: String, required: true }, // 带有默认值的数字 propD: { type: Number, default: 100 }, // 带有默认值的对象 propE: { type: Object, // 对象或数组且

  • Javascript中判断变量是数组还是对象(array还是object)

    怎样判断一个JavaScript变量是array还是obiect? 答案: 1.如果你只是用typeof来检查该变量,不论是array还是object,都将返回'objec'. 此问题的一个可行的答案是是检查该变量是不是object,并且检查该变量是否有数字长度(当为空array时长度也可能为0). 然而,参数对象[arguments object](传给制定函数的所有参数),也可能会适用于上述方法,技术上来说,参数对象并不是一个array. 此外,当一个对象有a.length属性的时候,这个方

  • Vue中强制组件重新渲染的正确方法

    有时候,依赖 vue 响应方式来更新数据是不够的,相反,我们需要手动重新渲染组件来更新数据.或者,我们可能只想抛开当前的DOM,重新开始.那么,如何让vue以正确的方式重新呈现组件呢? 强制 Vue 重新渲染组件的最佳方法是在组件上设置:key. 当我们需要重新渲染组件时,只需更 key 的值,Vue 就会重新渲染组件. 这是一个非常简单的解决方案. 当然,你可能会对其他方式会更感兴趣: 简单粗暴的方式:重新加载整个页面 不妥的方式:使用 v-if 较好的方法:使用Vue的内置forceUpda

随机推荐