将数据从子组件传递到父组件Vuetify

时间:2020-07-02 09:55:14

标签: vue.js vuetify.js

我正在尝试使用$ emit将数据从子组件传递到父组件,但这不起作用。

这就是我正在做的事情:

// child component
<v-text-field
   @change="function"
   v-model="choice1"
   label="Choice 1"
   ></v-text-field>

// Script 
metods:{
function(event) {
    this.$emit('input', this.choice1); // I tried 'change' at the place of 'input' but with no result too.  
 },
}
// parent component
<typeQst @change="getRep"></typeQst> // my child component

//script 
getRep(value){
     console.log(value);
        }

1 个答案:

答案 0 :(得分:0)

我看到一些错误:

    // child component
   <v-text-field

    <!-- DO NOT USE FUNCTION AS NAME -->
    @change="function"
    v-model="choice1"
    label="Choice 1"
    ></v-text-field>


   // Script 

   <!-- Here is Methods not Metods -->
   methods:{

     <!-- Same as before, change this method name accordingly -->
     function(event) {
       this.$emit('change', this.choice1); // I tried 'change' at the place of 'input' 
         but with no result too.  
        },
   }


   // parent component
   <!-- Here is most probably type-qst not typeQst, camel case get resolved automatically -->
   <typeQst @change="getRep"></typeQst> // my child component

   <!-- All This part needs to be in the vue export syntax as for the component before: -->
  [..]
  methods: {
     //script 
     getRep(value){
       console.log(value);
       }
   }
相关问题