Vue49-props属性

一、当同一个组件标签被使用多次

因为data属性写的是函数形式!

二、需求:老王也想用<Student>组件,但是需要动态把老王想要的值传进来。

2-1、使用props属性接收参数

使用props属性,接收的这三个参数,是被保存在当前组件vue的vc实例对象上的!!!

2-2、传参

2-3、显示需要加工的数据:

属性前不加:,写啥都是传入的字符串!!!

2-4、props接收参数,并限制传参类型

2-5、接收的同时对数据:类型限定、默认值指定、必要性限制。

2-6、props参数是只读的

props属性接收到的参数,值不建议修改!

2-7、修改传参

data中的key值,不能和props中的值,同名,同名的话,props中的优先级更高,data中的数据不生效,且控制套报错!

三、小结

相关推荐
小钰能吃三碗饭2 分钟前
第五篇:【React 性能优化秘籍】让你的应用丝滑流畅,告别卡顿!
前端·javascript·react.js
Zww08913 分钟前
vue3+vite+ts使用daisyui/tailwindcss
前端·vue.js·postcss
zoahxmy09293 分钟前
Vue3 使用 Signature Pad 实现电子签名(签名位置偏差问题解决)
vue.js
kevin不会飞3 分钟前
防抖、节流
前端·javascript
ak啊3 分钟前
Webpack热更新模块-HMR
前端·webpack·源码
Spirited_Away6 分钟前
还在用document.cookie操作cookie吗?试试这个
前端·javascript·面试
Z编程9 分钟前
elemenPlus中,如何去掉el-input中 文本域 textarea自带的边框和角标
前端·javascript·vue.js
独立开阀者_FwtCoder9 分钟前
不要再像我这样使用 React 导入了,试试 Wrapper 模式吧!
前端·javascript·数据库
chxii17 分钟前
6.3es新特性web worker
前端·javascript·ecmascript
harry75924 分钟前
Flex-1 布局实现内部滚动条
前端·javascript·css