小程序彈窗組件

fetchWay函數異步

const app = getApp()

function fetchUser(way, params){
  let promise = new Promise(function(resolve, reject){
    //請求
    if(way === 'get'){
      let MyUser = new wx.BaaS.User()
      MyUser.get(params.id).then(res => {
        // success
        console.log('請求成功')
        app.globalData.userInfo = res
        resolve(res)
      }, err => {
        // err
      })
    }
  })
  return promise
}

module.exports = {
  fetchUser: fetchUser,
}

login組件

login.js

data: {
    isShowTellInfo: 0,      //是否顯示告示信息
  },


methods: {
  userInfoHandler(data) {
      wx.BaaS.handleUserInfo(data).then(res => {
        // res 包含用戶完整信息,詳見下方描述
        FetchWay.fetchUser('get', res).then((res)=>{
          //請求完成
          console.log('完成肤无。鸯旁。藤韵。')
          console.log('#####USER###2', app.globalData.userInfo)
        })
      }, res => {
        console.log('login: failed', res)
      })
    },
    showMask() {
      let self = this;
      self.setData({
        isShowTellInfo: 2,
      })
     
    },
    hideMask() {
      let self = this
      self.setData({
        isShowTellInfo: 1,
      })
      setTimeout(() => {
        self.setData({
          isShowTellInfo: 0,
        })
      }, 500);
      
    },

  }

login.wxml

<view class="mask fccc {{isShowTellInfo == 2 ? 'fade-in' : isShowTellInfo == 1 ? 'fade-out' : ''}}" hidden="{{isShowTellInfo == 0 && true}}" bindtap="hideMask">
    <view class="panel fcsc" catchtap="catcTemp">
        
    </view>
</view>

lgoin.wxss

@import "../../app.wxss";

.panel{
    height: 60%;
    width: 60%;
    background-color: rgba(26, 22, 22, 0.65);
    border-radius: 16rpx;
    box-sizing: border-box;
    padding: 24rpx 15rpx;
    position: relative;
}





/*全屏的底部半透明陰影*/
.mask{
  position: fixed;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  background-color: rgba(26, 22, 22, 0.65);
  z-index: 1000;
}


/*動畫效果*/
.fade-in{
  animation: fi 0.6s ease 1 forwards;
}
.fade-out{
  animation: fo 0.6s ease 1 forwards;
}

@keyframes fi {
  from{
    opacity: 0;
  }to{
    opacity: 1;
  }
}

@keyframes fo{
  from{
    opacity: 1;
  }to{
    opacity: 0;
  }
}

引入頁面的寫法

test.json

{
  "usingComponents": {
    "login": "/component/login/login"
  }
}

test.wxml

<button bindtap='bindShowLogin'>
  未登錄提示
</button>
<login id="login" />

test.js

  onLoad: function (options) {
    let that = this

    that.Login = that.selectComponent('#login')

  },

 bindShowLogin: function(){
    let that = this
    that.Login.showMask()
  },

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
  • 序言:七十年代末蔗牡,一起剝皮案震驚了整個濱河市渐北,隨后出現的幾起案子诈皿,更是在濱河造成了極大的恐慌先慷,老刑警劉巖,帶你破解...
    沈念sama閱讀 210,978評論 6 490
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件判导,死亡現場離奇詭異嫉父,居然都是意外死亡,警方通過查閱死者的電腦和手機眼刃,發(fā)現死者居然都...
    沈念sama閱讀 89,954評論 2 384
  • 文/潘曉璐 我一進店門绕辖,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人擂红,你說我怎么就攤上這事仪际。” “怎么了昵骤?”我有些...
    開封第一講書人閱讀 156,623評論 0 345
  • 文/不壞的土叔 我叫張陵树碱,是天一觀的道長。 經常有香客問我变秦,道長成榜,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 56,324評論 1 282
  • 正文 為了忘掉前任蹦玫,我火速辦了婚禮赎婚,結果婚禮上刘绣,老公的妹妹穿的比我還像新娘。我一直安慰自己挣输,他們只是感情好纬凤,可當我...
    茶點故事閱讀 65,390評論 5 384
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著歧焦,像睡著了一般移斩。 火紅的嫁衣襯著肌膚如雪肚医。 梳的紋絲不亂的頭發(fā)上绢馍,一...
    開封第一講書人閱讀 49,741評論 1 289
  • 那天,我揣著相機與錄音肠套,去河邊找鬼舰涌。 笑死,一個胖子當著我的面吹牛你稚,可吹牛的內容都是我干的瓷耙。 我是一名探鬼主播,決...
    沈念sama閱讀 38,892評論 3 405
  • 文/蒼蘭香墨 我猛地睜開眼刁赖,長吁一口氣:“原來是場噩夢啊……” “哼搁痛!你這毒婦竟也來了?” 一聲冷哼從身側響起宇弛,我...
    開封第一講書人閱讀 37,655評論 0 266
  • 序言:老撾萬榮一對情侶失蹤鸡典,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后枪芒,有當地人在樹林里發(fā)現了一具尸體彻况,經...
    沈念sama閱讀 44,104評論 1 303
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 36,451評論 2 325
  • 正文 我和宋清朗相戀三年舅踪,在試婚紗的時候發(fā)現自己被綠了纽甘。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 38,569評論 1 340
  • 序言:一個原本活蹦亂跳的男人離奇死亡抽碌,死狀恐怖悍赢,靈堂內的尸體忽然破棺而出,到底是詐尸還是另有隱情货徙,我是刑警寧澤左权,帶...
    沈念sama閱讀 34,254評論 4 328
  • 正文 年R本政府宣布,位于F島的核電站破婆,受9級特大地震影響涮总,放射性物質發(fā)生泄漏。R本人自食惡果不足惜祷舀,卻給世界環(huán)境...
    茶點故事閱讀 39,834評論 3 312
  • 文/蒙蒙 一瀑梗、第九天 我趴在偏房一處隱蔽的房頂上張望烹笔。 院中可真熱鬧,春花似錦抛丽、人聲如沸谤职。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,725評論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽允蜈。三九已至,卻和暖如春蒿柳,著一層夾襖步出監(jiān)牢的瞬間饶套,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 31,950評論 1 264
  • 我被黑心中介騙來泰國打工垒探, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留妓蛮,地道東北人。 一個月前我還...
    沈念sama閱讀 46,260評論 2 360
  • 正文 我出身青樓圾叼,卻偏偏與公主長得像蛤克,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子夷蚊,可洞房花燭夜當晚...
    茶點故事閱讀 43,446評論 2 348