网友真实露脸自拍10p,成人国产精品秘?久久久按摩,国产精品久久久久久无码不卡,成人免费区一区二区三区

小程序模板網(wǎng)

xiaochun系列教程--自定義消息提示框

發(fā)布時間:2017-12-26 11:38 所屬欄目:小程序開發(fā)教程

需求描述:wx.showToast(OBJECT)接口調(diào)用,但是不需要icon和image,即便image為空也有占位,實際上只想輸出自定義文本內(nèi)容。效果截圖:代碼如下:!--index.wxml--!-- 頁面正文 --view block wx:for="{{50}}" view 12 ...

 
 
 

需求描述: 
wx.showToast(OBJECT)接口調(diào)用,但是不需要icon和image,即便image為空也有占位,實際上只想輸出自定義文本內(nèi)容。

效果截圖: 

代碼如下:

 

		
  1. <!--index.wxml-->
  2. <!-- 頁面正文 -->
  3. <view>
  4. <block wx:for="{{50}}">
  5. <view> 123456 123456 123456 123456 123456</view>
  6. </block>
  7. </view>
  8. <!-- 自定義彈窗 -->
  9. <view class="showModule" wx:if="{{isShow}}">
  10. <!-- 這部分內(nèi)容可以靈活修改,例如改成一個模態(tài)框 -->
  11. <view class="text ">{{text}}</view>
  12. </view>
 

		
  1. /* index.wxss */
  2.  
  3. .showModule {
  4. /* 用樣式控制隱藏 visibility: hidden;*//* flex 布局 */
  5. display: flex;
  6. justify-content: center;
  7. align-items: center;
  8. /* 生成絕對定位的元素,相對于瀏覽器窗口進行定位 */
  9. position: fixed;
  10. /* 如果 height,width 不變的情況下,left,top 不用修改 */
  11. left: 35%;
  12. top: 40%;
  13. height: 20vh;
  14. width: 30vw;
  15. /* 不透明 */
  16. opacity: 0.99;
  17. background-color: #7b7b7b;
  18. /* 圓角 */
  19. border-radius: 30rpx;
  20. }
  21.  
  22. .showModule .text {
  23. /* flex 布局 */
  24. display: flex;
  25. /* 字體加粗 */
  26. font-weight: bold;
  27. color: white;
  28. font-size: 13pt;
  29. font-family: "微軟雅黑";
  30. /* Helvetica,
  31. Arial,
  32. Hiragino Sans GB,
  33. Source Han Sans CN,
  34. PingFang SC,
  35. Roboto,
  36. 微軟雅黑,
  37. Heiti SC,
  38. Microsoft Yahei,
  39. sans-serif; */
 

		
  1. //index.js
  2. //獲取應(yīng)用實例
  3. var app = getApp()
  4. Page({
  5. data: {
  6. text: "彈窗內(nèi)容",
  7. isShow: false
  8. },
  9. onShow() {
  10. this.setData({
  11. text: "用戶取消支付",
  12. isShow: true
  13. })
  14. }
  15. })


易優(yōu)小程序(企業(yè)版)+靈活api+前后代碼開源 碼云倉庫:starfork
本文地址:http://www.xiuhaier.com/wxmini/doc/course/18246.html 復(fù)制鏈接 如需定制請聯(lián)系易優(yōu)客服咨詢:800182392 點擊咨詢
QQ在線咨詢
AI智能客服 ×