12.2 VUE学习之-if判断,实践加减input里的值
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>vue</title>
<link rel="stylesheet" href="">
<!--<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>-->
<!--<script type="text/javascript" src="../js/jquery-2.1.4.min.js"></script>-->
<script type="text/javascript" src="../js/vue.js"></script>
</head>
<body>
<div id="vue">
<div>
<span v-if="num > 0" v-on:click="dec(num)">-</span>
<input v-model="num" type="text">
<span v-on:click="inc(num)">+</span>
</div>
</div>
</body>
<script type="text/javascript">
var app = new Vue({
el: "#vue",
methods:{
dec:function(num){
if(app.num>0){
app.num=num-1;
console.log(app.num);
}
},
inc:function(num){
app.num=num+1;
console.log(app.num);
}
},
data:{
num:0,
}
});
</script>
</html>
效果:
12.2 VUE学习之-if判断,实践加减input里的值的更多相关文章
- 11.VUE学习之提交表单时拿到input里的值
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http ...
- 12.1.VUE学习之-循环li,if判断示例讲解class中应用表达式
功能: 当点击按键时,改变当前循环数组里的status里的值, 判断staus里的当前的值来,切换显示 删除 和 恢复 的按钮 判断staus里的当前的值来改变span标签里的字体颜色样式 <! ...
- php学习笔记：foreach循环访问关联数组里的值
foreach循环可以将数组里的所有值都访问到,下面我们展示下,用foreach循环访问关联数组里的值. 例如: $fruit=array('apple'=>"苹果",'ba ...
- Vue学习记录第一天
今天开始了Vue的学习,下面我就记录一下学习了什么. 1.什么是Vue? vue是一套基于javaScript的渐进式框架,是MVVM框架.View ——ViewModel——Model 其中Vie ...
- 09.1.VUE学习之watch监听属性变化实现类百度搜索栏功能ajax异步请求数据,返回数组
09.1html里 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> < ...
- 10.VUE学习之使用lodash库减少watch对后台请求的压力
问题描述 使用watch监听库里word的值的变化,获取新值后,用oxios发送的ajax异步请求, 此时会多次发送请求,浪费服务器资料. 解决办法 使用lodash库里的_.debounce函数延缓 ...
- 09.VUE学习之watch监听属性变化实现类百度搜索栏功能ajax异步请求数据,返回字符串
cmd下安装axios npm install axios 安装好后,会多出node_modules文件夹 思路: 监听data里的word改变时,发送ajax异步请求数据, 把返回的数据赋值给dat ...
- legend2---开发日志12（vue如何进一步学习）
legend2---开发日志12(vue如何进一步学习) 一.总结 一句话总结:还是得找教程(比如视频),自己摸索太浪费时间,也容易踩坑和抓不住重点 还是得找教程(比如视频),自己摸索太浪费时间,也容 ...
- Vue学习-01
1.vue 学习 v-bind:title 数据绑定 v-if 判断显示或者隐藏 <div id="app-3"> <p v-if="seen" ...
随机推荐
- (转)CentOS 7常见的基础命令和配置
CentOS 7常见的基础命令和配置 原文:http://blog.51cto.com/hujiangtao/1973566 管理服务 命令格式:systemctl COMMAND name.serv ...
- MapReduce 二次排序
默认情况下,Map 输出的结果会对 Key 进行默认的排序,但是有时候需要对 Key 排序的同时再对 Value 进行排序,这时候就要用到二次排序了.下面让我们来介绍一下什么是二次排序. 二次排序原理 ...
- Quality of Service (QoS) in LTE
Background: Why we need QoS ? There are premium subscribers who always want to have better user expe ...
- Mybatis-Plus使用全解
前言 之前写了<SpringBoot | 第九章:Mybatis-plus的集成和使用>一文,只是简单的使用条件构造器列举了一些通用的CURD操作.本人也想写一篇通用的关于mybatis- ...
- Web 前端安装依赖的时候遇到的问题
- 《给业余投资者的10条军规 (雪球「岛」系列) (闲来一坐s话投资》读书笔记
大多数进入股市的人,往往有着非一般的自信.比如,读了几本大师的书,就感觉自己掌握了什么秘笈,又恰逢账面浮盈,自信心更是前所未有的膨胀. 有人说,投资者不经过一轮牛熊转换是成熟不起来的. 古人早就有言, ...
- 安装mysql-installer-community
1.在官网上下载mysql-installer-community-5.6.25.0 2.选择MySQL Installer 3.选择Windows (x86, 32-bit), MSI Instal ...
- echarts折线图相关
optionJKDLine = { title: { text: '告警数量趋势图', textStyle:{ //标题样式 fontStyle:'normal', fontFamily:'sans- ...
- 软件测试Lab 1 Junit and Eclemma
首先安装eclipse 然后下载hamcrest-core-1.3.jar,下载地址:http://mvnrepository.com/artifact/org.hamcrest/hamcrest-c ...
- 微信小程序开发入门首选
推荐一本书吧,直接上图,微信开发,微信网页开发,微信小程序开发,都用得着. 推荐一本书吧,直接上图,微信开发,微信网页开发,微信小程序开发,都用得着. 推荐一本书吧,直接上图,微信开发,微信网页开发, ...