购买
下载掌阅APP,畅读海量书库
立即打开
畅读海量书库
扫码下载掌阅APP

2.7.2 按钮的事件绑定

本节主要介绍为页面按钮绑定事件的方法,图2-19所示的页面布局了三个按钮,分别是“警告按钮”按钮、“地图放大”按钮和“地图缩小”按钮。

图2-19 布局了三个按钮的页面

单击图2-19中的“警告按钮”按钮可弹出提示框,如图2-20所示;单击“地图放大”按钮可放大地图,如图2-21所示;单击“地图缩小”按钮可缩小地图,如图2-22所示。

为上述三个按钮绑定事件的方法是:创建Vue实例,将methods中的warningBtnHandleClick作为单击“警告按钮”按钮时的响应事件,将methods中的zoomUpBtnHandleClick作为单击“地图放大”按钮时的响应事件,将methods中的zoomOutBtnHandleClick作为单击“地图缩小”按钮时的响应事件。实现代码如下:

图2-20 单击“警告按钮”按钮的效果

图2-21 单击“地图放大”按钮的效果

图2-22 单击“地图缩小”按钮的效果

页面布局代码如下: UJd8EJCjw7XGv3uAeOed0uSGnboziQ4a6wJCQW9nCro2hyyZTVuOQLoOErA1aRDT

点击中间区域
呼出菜单
上一章
目录
下一章
×