VUE 父组件向子组件传值 (用属性传值)
2018-04-23 21:28
459 查看
父组件向子组件传值 (用属性传值)
1. 在父组件中定义要传的值 有2种大的类型
1.传值包括 string number boolean
2.传引用包括 array object 改变一处,所有的引用都改变
2.用v-bing将值绑定到子组件标签上。
3.在子组件中用props接收绑定的值。
4.最后就可以在methods里的方法中通过this 获取和操作这个值了。
举个栗子:父组件中的
[code] <template> <div id="home"> <header v-bind:fu="ti"></header> <footer v-bind:fu="ti"></footer> </div> </template> <script> import Header from './Header' import Footer from './Footer' export default { name: 'home', components:{ "header":Header, "footer":Footer, }, data(){ return{ ti:"我是string父传子的" } }, name:'header', // props:["fu"], //属性传直 props:{ //接收父传过来的 fu:{type:String,required:true} },阅读更多
相关文章推荐
- Vue 使用Props属性实现父子组件的动态传值
- VUE2.0 父组件传值给子组件初始化用
- Vue父子组件传值
- vue界面传值(子父组件)
- Vue系列: 如何通过组件的属性props设置样式
- 使用vue开发输入型组件更好的一种解决方式(子组件向父组件传值,基于2.2.0)
- vue2.0 组件化及组件传值
- VUE组件传值
- vue 中 父组件对子组件设置v-if 属性应注意
- vue基础语法以及父子组件如何相互传值
- Vue中获取组件声明时的name属性
- vue遇到过的坑(父组件向输入框组件传值进去,然后子组件利用传进来的数据进行数据绑定的问题与解决方法)
- vue使用组件时,需要给传递的props属性默认值细节
- Vue2.0 子组件传值给父组件
- Vue父子组件传值
- vue-子组件向父组件传值
- vue组件属性中字符串如何拼接变量?
- Vue组件中prop属性使用说明实例代码详解
- Vue不同组件之间相互传值
- vue 的 $emit 的用法(父子组件传值)