v-model

v-model 其实是一个语法糖，背后本质上包含两个操作：

1. v-bind 绑定一个 value 属性
2. v-on 指令给当前元素绑定 input 事件，修改 value

<input type='text' v-model='message'>
<input type='text' v-bind:value='message' v-on:input='message = $event.target.value'>

v-model 赋值data中绑定的数据时，永远保存 string 类型。

💣 checkbox 和 radio 使用 v-model 时，input 除了 v-model='array' 之外，还要有 value 属性，这样才会将 value 的值放到 v-model 绑定的数组中。

v-bind

v-bind 绑定一个对象，将对象属性用作标签的属性。props 传值也可以绑定对象。

<template>
  <h2 v-bind='info'>hello</h2>
</template>

data() {
  return {
    info:{
      name:'lxx',
      age:18,
      height:1.88
    }
  }
}

渲染结果

<h2 name='lxx' age='18' height='1.88'>hello</h2>

v-on

绑定一个对象，可以执行多个事件。

<div v-on='{click:btnClick, mousemove:btnMove}'></div>
<div @click='boxClick(), btnClick()'></div>