vue两个按钮切换_vue点击循环 添加列表 点击来回切换
1.v-on:绑定一个事件 后面放事件名 简写 @事件名=“函数”
例如:
按钮
var vm=new Vue({
el:'#itany',
data:{
msg:'hello'
},
methods:{
alt:function(){
// alert(000)
// console.log(this.msg);
console.log(vm.msg);
}
}
})
2.添加列表
例如:
添加
{{value}}
删除
new Vue({
el:'#itany',
data:{
arr:['吃饭','睡觉','打游戏'],
txt:''
},
methods:{
add:function(){
this.arr.push(this.txt),
this.txt=''
},
delt:function(ind){
this.arr.splice(ind,1)
}
}
})
QQ图片20180912225110.png
3.点击来回切换
例如:
{{msg}}
按钮
new Vue({
el:'#itany',
data:{
msg:'hello word',
// txt:'hello vue',
flag:true
},
methods:{
chg:function(){
// this.msg=this.txt
if(this.flag){
this.msg='hello vue',
this.flag=false
}else{
this.msg='hello word'
this.flag=true
}
}
}
})
QQ图片20180912225255.png
vue两个按钮切换_vue点击循环 添加列表 点击来回切换相关推荐
- vue获取tr内td里面所有内容_vue的v-for循环添加tr,取tr中的某两个td进行运算
我做一个页面,需要实现以下功能: 1.点击add按钮给表格动态添加一行tr(每行tr含13个td) [需求1实现: ...] 2.每行tr结尾有删除,点击任意行的删除按钮就删除该行整条数据 [需求2实 ...
- python箭头向下怎么变_实现点击下箭头变上箭头来回切换的两种方法【推荐】
我所知道的常用的就这两种. 第一种:说明一下我用的是fontawesome字体,首先要去官网下载来用 我用的是bootstrap,所以hidden是自带的,上面的初始状态就是下箭头angle-down ...
- vue两个按钮切换_在vue中实现多个按钮样式的点击切换?
1.在vue中实现多个按钮样式的点击切换?有多个按钮,点击其中一个出现下划线,而另一个回到原始状态. 点击其中一个两个同时出现下划线样式: 再次点击两个都还原成最初的样式,即有下划线: 如何实现只有被 ...
- vue两个按钮切换_vue实现按钮切换图片
本文实例为大家分享了vue实现按钮切换图片的具体代码,供大家参考,具体内容如下 Tab选项卡 实现步骤 1.实现静态UI效果 用传统的方式实现标签结构和样式 2.基于数据重构UI效果 将静态的结构和样 ...
- vue 计算文件hash值_vue的hash值原理,也是table切换。
.pages>div{display: none;} aaa bbb cccc 首页 关于我的页面 用户中心 //hash 和页面一一对应起来 //router 配置 var router = ...
- vue 事件调用 传参_vue如何在父组件指定点击事件后向子组件传递参数并调用子组件的事件?...
可以给父组件写一个ref属性,父组件可以通过ref拿到子组件中的数据和方法(即例子中子组件的say方法),这样在父组件中就可以触发子组件的事件了.而父组件向子组件传参可以通过prop属性(即例子中的f ...
- vue两个卡片并排_Vue组件-卡片层叠拖拽
组件效果 tantan.gif 项目地址 npm安装 npm install vue-tantan-stack --save 如何使用 prev next import stack from '../ ...
- flash播放与html切换,html解决IE浏览器多个flash,来回切换,不能再次播放的问题...
allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage= ...
- Vue——按钮名字点击来回切换
需求:vue里的button要在点击之后来回切换按钮名字. 比如一开始叫"显示监控",点击后变成"隐藏监控',再次点击又变成"显示监控". 实现: & ...
最新文章
- 事务隔离性与隔离级别
- 端上智能——深度学习模型压缩与加速
- PyInstaller 生成exe文件
- 十年了,斯坦福和CMU的这场对决,开启了无人车时代
- 详解:Spark程序的开始 SparkContext 源码走一走
- jquery使用规则
- php开发技术规范怎么写,PHP开发技术规范!(2)
- PS中有哪些快速抠图的方法
- ubuntu mysql卸载教程_ubuntu下安装mysql及卸载mysql详细教程/方法
- [ARC086]F - Shift and Decrement 位运算+数论+DP
- mysql升级8.0后,项目遇到的坑
- 关于介绍最好用的windows10系统的文章
- 【微信小程序】页面返回且带回数据
- 《全心全意地投入》——英文小译二【英文短篇正能量】
- 高校bbs及科研论坛
- BJSubwayPen -- 北京地铁路线图绘制工具 开源啦~~
- 杰理zHiUSB设备功能【篇】
- 对 matplotlib.cm.RdYlBu() 的理解
- 网站首页banner的高度计算
- CultureInfo 类