通过v-if 控制true/false 可以使两个DIV隐藏显示切换
Html部分
???<div id="index-content"> ???????<div> ???????????<a @click="showNewGoodsTab">点击板块一显示板块二隐藏</a> ???????????<a @click="showOftenRouteTab">点击板块二显示板块一隐藏</a> ???????</div> ???</div> ???????<!-- 包含两个板块的DIV --> ???<div class="mui-content"> ???????<!-- 板块一 --> ???????????<div v-if="new_goods_show">板块一</div> ???????<!-- 板块二 --> ???????????<div v-if="often_route_show">板块二</div> ???</div>
Js部分
???????????????var pub_index_content = new Vue({ ???????????????????el:"#index-content", ???????????????????data:{ ???????????????????????new_goods_show:true, ???????????????????????often_route_show:false ???????????????????}, ???????????????????methods: { ???????????????????????showNewGoodsTab: function() { ???????????????????????????this.new_goods_show = true; ???????????????????????????this.often_route_show = false; ???????????????????????}, ???????????????????????showOftenRouteTab: function() { ???????????????????????????this.new_goods_show = false; ???????????????????????????this.often_route_show = true; ???????????????????????} ???????????????????} ???????????????})
vue.js ??v-if 控制true/false
原文地址:https://www.cnblogs.com/cp123/p/9938467.html