VUE-计数器v-on

关键词：

v-on:所监听的事件=“所使用的方法/变量”

v-on:click="counter++"

一、准备工作

安装VUE：https://blog.csdn.net/csdnhnma/article/details/116784455

 

二、目标--实现计数器功能

1、新建变量

一个counter变量 保存计数结果，两个button（ + -）

2、显示变量和button

3、添加button 点击事件

传统命令式实现方式：

VUE声明式实现方式：

 

当发生一个事件后 界面变得比较复杂该如何做？通过函数

4、函数

定义了一个名叫add 的函数类型和sub函数

把函数名添加到div元素行

刷新浏览器，显示日志

 

如何在前端更新当前计数，要拿到本“app”对象里的全局变量 counter，用 this点

当点击+ - 按钮时，同步更新 “当前计数”

语法糖：@  是一种简写方式

三、总结