微信小程序 —— 动态决定页面元素显示或隐藏的技巧

在微信小程序开发中，经常遇到一些由后台控制显示（is_open : 1）或者隐藏（is_open : 0），有俩种办法：

• 复杂办法

  • 1.先在元素的class中 class=’{{show?’true’:’hidden’}}’
  • 2.再在相对应的js中配置show的值，例 data: {show:1,}
  • 3.最后在相对应的css中定义
  • .hidden{display:none;}

---

• 简单办法
• 直接在元素中加入wx:if=”{{is_open !=”}}”代码，后台传到前端的is_open为1时，元素就显示；为0时就不显示，如：

  <button wx:if="{{show !=''}}" class="free-contactButton" open-type='contact'>
      <view class="iconfont icon-duihuaxinxi"></view>
  </button>