vue2中的prop设置default有什么用？（转）

最新推荐文章于 2024-08-05 14:49:21 发布
最新推荐文章于 2024-08-05 14:49:21 发布
阅读量1.3k 收藏
点赞数
分类专栏： vueStudy

这里写图片描述
不明白为啥prop里面还写个default
百度了下，恍然大悟
代码如上《感觉default没什么用啊，也没什么提示和效果。
已经解决：原以为default是传入的值不符合类型要求，之后默认的值。原来是没有任何值的时候默认的值

保证你需要用到该属性的时候不会为undefined

默认值啊，因为你传了num和num2到两个prop中，所以默认值被覆盖了

已经解决：原以为default是传入的值不符合类型要求，之后默认的值。原来是没有任何值的时候默认的值

感谢分享

http://www.caotama.com/103234.html

Web_vStrong
关注
专栏目录
Vue中props的默认值defalut使用this时的问题
weixin_45242865的博客
11-09 3940
Vue 中 props 的默认值 default 使用 this 时的问题
解决vue prop传值default属性如何使用,为何不生效的问题
10-14
Vue还允许我们为prop设置默认值，这样即使外部没有传递相应的属性，组件内部也能有一个默认的值来使用。 然而，在使用props的default属性时，可能会遇到一些困惑，比如default属性不生效的情况。这种情况经常发生，...
vue2中的prop设置default有什么用？
有问题可关注公众号：前端研究院 后台输入问题回复
08-01 1万+
不明白为啥prop里面还写个default 百度了下，恍然大悟 代码如上《感觉default没什么用啊，也没什么提示和效果。 已经解决：原以为default是传入的值不符合类型要求，之后默认的值。原来是没有任何值的时候默认的值 保证你需要用到该属性的时候不会为undefined 默认值啊，因为你传了num和num2到两个prop中，所以默认值被覆盖了 已经解决：原以为d...
一文读懂 ESLint配置
最新发布
擅长将自己的感受、想法、知识通俗地表达出来，会点前后端开发、自动化测试、性能测试、爬虫。将来可能学硬件、AI。但一定会写实用的脚本。
08-05 1万+
本篇介绍了代码校验工具ESlint的配置规则与常用的配置项，无论是新手还是老手都能有所收获 背景色是野菊紫
vue中 props 设置default得作用
sunlizhen的专栏
05-25 7112
default里面设置得原来是没有任何值的时候默认的值
vue2中props属性设置一个对象或数组的默认值
weixin_46504400的博客
04-15 906
在Vue.js中，如果您想要为一个props属性设置一个对象或数组的默认值，您应该使用一个函数来返回这个默认值。这是因为对象和数组是引用类型，直接将它们作为默认值可能会导致预设的默认值被所有实例共享，这不是我们想要的结果。在这个示例中，我们定义了一个名为myObjectProp的props属性，其类型为Object。然后，我们提供了一个默认值函数，它返回一个新的对象。这样，每个实例都会有自己的默认值对象，而不是共享同一个对象。
Vue2-count组件声明props自定义属性
tq040626的博客
07-07 94
1、props是组件的自定义属性，在封装通用组件的时候，合理地使用props可以极大的提高组件的复用性。
深入浅析Vue中的Prop
08-27
深入浅析Vue中的Prop Vue中的Prop是组件之间通讯的重要桥梁， Props是从父组件传递给子组件的-immutable数据。下面将详细介绍Vue中的Prop。 Prop的基本用法 ---------------- Prop的基本用法很简单，只需要在子...
解决vue2 在mounted函数无法获取prop中的变量问题
12-03
如下所示； props: { ...以上所述是小编给大家介绍的解决vue2 在mounted函数无法获取prop中的变量问题，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大
Props中default用法及踩坑记录
michiko98的博客
04-12 1686
简单的说就是在 props-default里面无法引用到 data的数据，所以修改的时候要把data数据复制到default处。同时也要注意用一个工厂函数去返回数组或者对象。用data中的变量，为props赋默认值，尝试多种方法都失败。父组件未向子组件传参数arrList的情况下，一直获取不到default的值。（注意事项已在注释中说明）
vue3 props设置default
weixin_45825057的博客
09-13 544
/ 除了验证是否符合type的类型，此处再判断该值结果是否符合验证。
浅谈vue-props的default写不写有什么区别
11-19
注意 default 不要写成 defaults 例如有一个名为mk-test的组件如下： <template> <div>{{maxLength}}</div> </template> [removed] export default { props: { maxLength: { type: Number, default: 1 } } } [removed] 当父组件这样调用时： <mk></mk> 渲染出来是： 1 如果把组件的default:1删除，父组件调用方式不变，此时渲染结果是： 0 此时如果
vue props default Array或是Object的正确写法说明
11-19
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: (
vue2 props
weixin_53315593的博客
03-28 1640
例如，对于一个给定的对象 post：下面两者等效，比如这次的preview的属性，传入两个对象，对象的每个属性都是preview的属性，不必每个属性都bind一次，直接bind两个对象就好，这样属性的名字和对象的属性一样，不过更好的做法是在设置prop的时候按照传进来的两个对象设置，这样直接用对象赋值即可。当用props的值来初始化data时，并非用的传进来的响应式变化的值，而是props的default值，如果这个值没有默认初始值，则类型为undefined，如何验证呢？看下面的一个demo。
Vue2——props配置
mantou_riji的博客
07-19 4774
/组件交互的代码（数据、方法），相当于非单文件中的出了template的配置。//组件交互的代码（数据、方法），相当于非单文件中的出了template的配置。可以对接收参数的数据格式进行限制，同时可以限制属性是否是必需的，也可以设置默认值。//组件交互的代码（数据、方法），相当于非单文件中的出了template的配置。需求学生页面的数据是动态传入的，而不是写死的——引入props配置。App.vue传入数据的时候通标签的属性传入，/*组建的样式*//*组建的样式*//*组建的样式*/.........
函数组件，默认值，props默认值
imkaifan的博客
11-08 1208
如果没有传递，那么就是 取消 确定按钮，如果传递了，就是传递的值。 <FilterFooter className={styles.footer } cancelText={'清除'} /> import React from 'react' import { Flex } from 'antd-mobile' import PropTypes from 'prop-types' import styles from './index.module.css' function Fil.
vue98-props中default默认值
geyaoisnice的博客
07-03 968
vue
vue props设置默认值的基本方式
我总是词不达意的博客
07-07 4841
props设置默认值 props设置对象默认值 props设置数组默认值
Vue之props指定default值的使用方法
热门推荐
Maybe_Frank
05-14 2万+
在父组件向子组件传递数据时，把props中的默认值传给子组件，如下代码，自定义组件不写属性就是显示的title中default值“长城”。 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>test21</title> <script src="https://unpkg.com/vue/dist/vue.js"&gt
Vue 的 $set 是什么？都有什么用？
03-31
Vue 的 $set 是一个实例方法，用于在响应式对象中添加一个新属性并确保这个新属性也是响应式的。 Vue 中的响应式系统是基于 JavaScript 的 getter 和 setter 实现的，当一个对象被添加到 Vue 的响应式系统中时，Vue 会将对象的所有属性转变为 getter 和 setter，当属性被修改时，会触发视图的重新渲染。 然而，如果一个对象在 Vue 的响应式系统中被添加后，再直接给这个对象添加新的属性，这个新属性并不会自动转变为 getter 和 setter，因此也不会触发视图的重新渲染。这时就需要使用 $set 方法来手动将新属性转变为响应式属性。 例如： ``` <template> <div> <div>{{ obj.name }}</div> <button @click="addProp">Add Prop</button> </div> </template> <script> export default { data() { return { obj: { name: 'Vue' } } }, methods: { addProp() { this.obj.age = 3 // 不会触发视图的重新渲染 this.$set(this.obj, 'age', 3) // 会触发视图的重新渲染 } } } </script> ``` $set 方法的使用方式和参数和 JavaScript 的原生方法 Object.defineProperty() 类似，第一个参数是被添加属性的对象，第二个参数是属性名，第三个参数是属性值。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值