码迷,mamicode.com
首页 > 其他好文 > 详细

vue通信

时间:2018-06-21 01:46:56      阅读:174      评论:0      收藏:0      [点我收藏+]

标签:console   ons   component   out   click   this   route   注册   outer   

首先注册父子vue路由页面在router/index.js文件下

import son from ‘@/components/son‘  //子
import video from ‘@/components/video‘  //父

{
      path:‘/video‘,
      name:‘video‘,
      component:video
      },
{
      path:‘/son‘,
      name:‘son‘,
      component:son
      },

组件嵌套:

1.父
<son :id="p"></son>
2.父
import son from ‘./son.vue‘
3.父
components:{
    son
  },

4.  子组件上props:[‘id‘],

5.子组件上访问:console.log(this.id);就可以访问到父组件上的数据

子组件更改父组件值
1.在父组件中自定义一个事件,<son @sh="meth"></son>
2.父组件注册事件处理函数
meth(){
      this.dataabc="change dataabc!"
    }
3.子组件中<p @click="change">changing</p>
4.子组件中监听父组件的自定义事件
change(){
                this.$emit(‘sh‘);
            }

vue通信

标签:console   ons   component   out   click   this   route   注册   outer   

原文地址:https://www.cnblogs.com/cyany/p/9206563.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!