項(xiàng)目中開(kāi)始使用微信提供的wx.Modal ，當(dāng)從a頁(yè)面跳轉(zhuǎn)到b頁(yè)面，由于a
頁(yè)面有異步操作，會(huì)造成b頁(yè)面無(wú)故彈出錯(cuò)誤提示，本案例只是簡(jiǎn)單封裝，方便使用
github項(xiàng)目地址 : https://github.com/fancaixia/wx_modal

modal.png

顯示模態(tài)框：utils.openShadow(this,text)

• 第一個(gè)參數(shù)：當(dāng)前作用域
• 第二個(gè)參數(shù)：提示信息, 可不傳默認(rèn)為(" 網(wǎng)絡(luò)異常！請(qǐng)稍后重試 "）

關(guān)閉模態(tài)框： utils.closeShadow(this);

wxml文件

 <rich-text nodes="{{nodes}}" wx:if="{{shadowFlag}}" bindtap="closeShadow">
</rich-text>

js 文件

let  utils = require('../../utils/utils.js')
Page({
  data: {

  },
  onLoad(){
    //定時(shí)器延遲  模擬查詢數(shù)據(jù)庫(kù)返回信息
    setTimeout(() => {
      utils.openShadow(this)
    }, 1000)
  },
  //點(diǎn)擊模態(tài)框關(guān)閉
  closeShadow(){
    utils.closeShadow(this);
  },

})

utils.js

function setnodes(text){
  return [{
    name: 'div',
    attrs: {
      class: 'div_shadow',
      style: ''
    },
    children: [{
      name: "div",
      attrs: {
        style: "",
        class: "modal"
      },
      children: [{
        name: "p",
        attrs: {
          style: "",
          class: "title"
        },
        children: [{
          type: "text",
          text: text
        }]
      },
      {
        name: "div",
        attrs: {
          style: "",
          class: "btnbox"
        },
        children: [{
          name: "div",
          attrs: {
            style: "",
            class: "confirm-container"
          },
          children: [{
            type: "text",
            text: '確定'
          }]
        }],

      }]

    }]
  }]
}
//顯示模態(tài)框
const openShadow = (that, text ="網(wǎng)絡(luò)異常！請(qǐng)稍后重試")=>{
      that.setData({
        shadowFlag: true,
        nodes: setnodes(text),
      })
}
//關(guān)閉模態(tài)框
const closeShadow= (that)=>{
    that.setData({
      shadowFlag: false,
      nodes: [],
    })
}

  module.exports = {
    openShadow,
    closeShadow,
  }