组件传值（子传父 父传子）

Vue的组件传值

父传子
首先在父组件引入子组件，，然后在父组件中v-bind{函数名，要传的数值}
在子组件中需要一个接收器，props:{ 父组件的函数名}

import menuNav from "@/components/menuNav";  //引入子组件
 data() {
    return {
      titleName:""   //需要绑定的值
    };
  },
components: {
    menuNav  //注册组件
  },
<menuNav :titleName="titleName"></menuNav> //使用组件

子组件同过prop接收父组件的函数名，

 props:["titleName"]  //接收父组件传给子组件的值
<span class="f-36-p-fff">{{titleName}}</span>//绑定值

子传父
先在父组件引入子组件，在父组件绑定一个事件，事件名=子组件函数名，（v-on:子组件函数名=b）在method{}中使用b事件名b:function(){}用于接收子组件传的子，而子组件$emit(函数名传入父组件，值）
父组件

import contents from "./components/contents";  //引入子组件
data() {
    return {
      titleName:""   //data中需要接收的值，可写可不写
    };
  },
components: {
    contents   //注册组件
  },
 methods:{
    son:function(data){
      console.log(data);
      this.titleName=data;    //接收的值赋给data中，或者直接使用 {{data}}
    }
  }
<contents v-on:ListenerSon="son"></contents>   //使用子组件

子组件

mounted(){
    this.$emit("ListenerSon","绑定设备");    //传送的数值
  }