vue实现计时器,vue制作计算器

　　本文主要详细介绍真空电子计数器的简易制作。本文中的示例代码非常详细，具有一定的参考价值。感兴趣的朋友可以参考一下。

　　本文分享vue计数器的简单代码，供大家参考。具体如下。

过程注意事项

　　创建vue实例时：el(挂载点)数据(方法)。

　　v-on指令的作用是绑定事件，缩写为@。

　　方法通过此关键字获取数据中的数据。

　　v-text指令的作用是设置一个元素的文本值，缩写为{{}}。

　　v-html指令用于设置元素的innerHTML。

实际代码与截图

　　html lang=en

　　头

　　meta charset=UTF-8

　　meta name= viewport content= width=device-width，initial-scale=1.0

　　标题计数器/标题

　　/头

　　身体

　　div id=应用程序

　　！-柜台功能区-

　　div class=input-num

　　button @click=sub

　　-

　　/按钮

　　span{{num}}/span

　　按钮@click=添加

　　/按钮

　　/div

　　/div

　　！-开发环境版本，包含有用的命令行警告-

　　script src= https://cdn . jsdelivr . net/NPM/vue/dist/vue . js /script

　　脚本

　　//vue实例

　　var app=新Vue({

　　埃尔： #app ，

　　数据：{

　　数字：1

　　},

　　方法：{

　　add:function(){

　　//console.log(add )

　　if(this.num10){

　　this.num

　　}否则{

　　alert(‘别点，这是最大的！’);

　　}

　　},

　　sub:函数(){

　　//console.log(sub )

　　if(this.num0){

　　this . num-；

　　}否则{

　　alert(‘别点了，最小的！’);

　　}

　　}

　　},

　　})

　　/脚本

　　/body

　　/html

　　vue.js组件教程请点击专门的vue.js组件学习教程进行学习。

　　这就是本文的全部内容。希望对大家的学习有帮助，支持我们。

郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。