使用Vue.js怎么实现点击切换按钮改变内容
今天就跟大家聊聊有关使用Vue.js怎么实现点击切换按钮改变内容，可能很多人都不太了解，为了让大家更加了解，小编给大家总结了以下内容，希望大家根据这篇文章可以有所收获。
成都创新互联主要从事网页设计、PC网站建设（电脑版网站建设）、wap网站建设（手机版网站建设）、成都响应式网站建设公司、程序开发、网站优化、微网站、小程序定制开发等，凭借多年来在互联网的打拼，我们在互联网网站建设行业积累了丰富的成都网站建设、网站建设、网站设计、网络营销经验，集策划、开发、设计、营销、管理等多方位专业化运作于一体。
代码描述：点击切换按钮，来改变显示的内容，切换不同的单位。flag相当于一个开关，控制开关的改变，来切换不同的单位。同样适用于其他的切换内容实例，也可设置按钮点击显示隐藏等。
vue点击切换改变内容
new Vue({
el:"#example",
data:{
flag:true,//单位切换开关
btnText:'元/吨',
},
methods:{
showToggle:function(){
this.flag = !this.flag
if(this.flag==true){
this.btnText = "元/吨"
}else if(this.flag==false){
this.btnText = "元/方"
}
}
}
})
拓展知识：vue 点击按钮改变页面显示内容的方法
如下所示：
Title
change
var vm = new Vue({
el:'#one',
data:{
loginType : 'username'
},
methods:{
change:function(){
if(this.loginType=='username'){
this.loginType='email'
}
else{
this.loginType='username'
}
}
}
})
看完上述内容，你们对使用Vue.js怎么实现点击切换按钮改变内容有进一步的了解吗？如果还想了解更多知识或者相关内容，请关注创新互联行业资讯频道，感谢大家的支持。
网页标题：使用Vue.js怎么实现点击切换按钮改变内容
地址分享：http://kswjz.com/article/jojiid.html
