vue学习笔记---(1)数据绑定(v-model && v-bind)和事件处理(v-on)

数据绑定和事件处理

1. v-bind
   • v-bind是单向绑定，用来绑定数据和属性以及表达式，只能将vue中的数据同步到页面。
2. v-model
   • v-model是双向绑定，不只能将vue中的数据同步到页面，而且可以将用户数据的数据赋值给vue中的属性。
3. v-on 事件处理
   • 绑定事件监听器。事件类型由参数指定。表达式可以是一个方法的名字或一个内联语句，如果没有修饰符也可以省略
   • 用在普通元素上时，只能监听原生 DOM 事件。用在自定义元素组件上时，也可以监听子组件触发的自定义事件。

   ---

Demo.vue

<template>
  <div>
    单向数据绑定：<input type="text" v-bind:value="name">
    <!-- 简写形式 -->
    单向数据绑定：<input type="text" :value="name">
    <hr>

    双向数据绑定：<input type="text"