vue子组件修改父组件的值(子传父 )

 子组件 修改 父组件的值  子传父 

父组件:
    <template>
      <parent @change-type="onChangeType"></parent>
    </template>
    <script>
      data () {
       return {
        types: 0,
      },
      methods: {
       onChangeType (type) { // type是子组件$emit传递的参数值

        console.log(type)
        this.types = type
       }
      }
    </script>

子组件:
    <template>
     <div>
      <span @click="changeFn(0)"></span>
      <span @click="changeFn(1)"></span>
      <span @click="changeFn(2)"></span>
     </div>
    </template>
    <script>
      data () {
       return {
        types: 0,
      },
      methods: {
        changeFn (type) {
          this.types = type
          this.$emit('change-type', type) // 用来触发父组件定义的@change-type
       }
      }
    </script>

父组件 定义 @function  名字  

子组件 就用什么名字 以 @中名字为主

传值给 父 

原文地址:https://www.cnblogs.com/lllomh/p/14991905.html