4. Vue 监听子组件(v-model方式)

最新推荐文章于 2024-09-30 10:50:08 发布

白怀宇

最新推荐文章于 2024-09-30 10:50:08 发布

阅读量834

点赞数

分类专栏： Vue2 学习笔记文章标签： vue

本文链接：https://blog.csdn.net/b342216980/article/details/106729764

版权

Vue2 学习笔记专栏收录该内容

45 篇文章 0 订阅

订阅专栏

Vue 监听子组件(v-model方式)

1 缺点：只能实现1个数据的绑定

<div id="app">
  <input-mod v-model="inputVal"></input-mod>	
  <div>{{ inputVal }}</div>
</div>

Vue.component('input-mod', {
  props: ['value'],
  template: `
    <div>
      输入控件：<input type="text" 
        :value="value"
        @input="$emit('input', $event.target.value)"
      >
    </div>	
  `
})
app = new Vue({
  el: '#app',
  data: {
    inputVal: '默认值'
  },	
})