在页面上添加一个按钮元素 ... 现在我想在这个按钮上绑定一个点击事件,用户点击它的时候可以执行应用里面的某个方法去做一些事情 ... 在这个按钮元素上,添加一 v-on 指令,绑定一个 click ,点击事件 ... 然后用 logMessage 这个方法来处理这个点击事件 ..
在应用里面,添加一个 methods 属性,在这里你可以定义一些方法 ... 现在我们需要一个 logMessage 方法 ... 这个方法要执行的任务可以先简单的在控制台上输出应用里的 message 这个属性的值 ..
点一下页面上的这个按钮 ... 在控制台上会显示 message 属性里的内容 ...
Vue 里的 v-model 指令可以让双边绑定非常简单 ... 也就是把输入与应用的状态绑定到一块儿 ... 用户的输入影响应用的状态,应用的状态的变化也会影响到输入 ...
添加一个 input 元素,在上面用一下 v-model ... 把这个元素跟应用里的 message 属性绑定到一块儿 ... 你会发现,这个文本框上会显示 message 里的内容 ...
修改一下文本框里的内容 ... 会影响到应用的 message 这个属性的值 ... 在页面上显示这个 message 信息的地方会立即做出响应 ...
再点一下这个按钮 .. 会在控制台上输出当前的 message 属性里的值 ...