微信小程序之遮罩功能實現

1.放一個空div，作為遮罩層最外層

 <view class='mask' v-if="{{flag}}"></view>

2.寫這個遮罩層樣式

.mask{
  width:100%;
  height:100%;
  position:absolute;
  background-color:#999;
  z-index:9999;
  top:0;
  left:0;
  opacity:0.5;
}

其中顏色可以任選，透明度也可以任選。
兼容處理：

-moz-opacity: 0.7;
opacity: 0.70;
filter: alpha(opacity=70);

3.控制顯示還是隱藏

用v-if或者hiddle的true和false來控制遮罩的顯示或者隱藏，當flag設置為false時，隱藏；為true時，顯示

// 遮罩層顯示
  show: function () {
    this.setData({ flag: false })
  },
  // 遮罩層隱藏
  conceal: function () {
    this.setData({ flag: true })
  },