vue2 组件 v-model

在Vue2中，组件是Vue应用程序的基本构建块之一。组件可以封装可复用的代码，并将其视为自定义HTML元素来使用。v-model是Vue提供的一个指令，用于在组件中实现双向数据绑定。

当在组件上使用v-model指令时，它会自动将value属性和input事件绑定到组件的props和emit事件上。这样，我们可以通过v-model在父组件中直接修改子组件的数据，并且子组件也可以通过触发input事件来通知父组件数据的变化。

下面是一个简单的示例，展示了如何在Vue2组件中使用v-model：

<template>
  <div>
    <input type="text" :value="value" @input="$emit('input', $event.target.value)">
  </div>
</template>

<script>
export default {
  props: ['value'],
}
</script>

在上面的示例中，我们创建了一个简单的输入框组件。通过props接收父组件传递的value属性，并将其绑定到输入框的value属性上。当输入框的值发生变化时，通过触发input事件并传递新的值来更新父组件的数据。