In the following example, I have the vue instance variable "formTerms" that I want to bind to the component property "abc", which itself is bound to the inputfield in its template. When changing the input's value, I want the instances "formTerms" variable to get that value. However, the code does not seem to work.
JS:
Vue.component('terms',{
model: {
prop: 'abc',
event: 'submit',
},
props: ['abc'],
template: '<div><input type="text" name="terms" class="form-control" title="" @change="submit" :value="abc"/></div>',
methods: {
submit: function() {
this.$emit('submit', this.abc);
}
}
});
var vm = new Vue({
el: '#id',
data: {
formTerms: ''
},
});
HTML:
<terms v-model="formTerms"></terms>