<span id="mktg5"></span>

<i id="mktg5"><meter id="mktg5"></meter></i>

        <label id="mktg5"><meter id="mktg5"></meter></label>
        最新文章專題視頻專題問答1問答10問答100問答1000問答2000關鍵字專題1關鍵字專題50關鍵字專題500關鍵字專題1500TAG最新視頻文章推薦1 推薦3 推薦5 推薦7 推薦9 推薦11 推薦13 推薦15 推薦17 推薦19 推薦21 推薦23 推薦25 推薦27 推薦29 推薦31 推薦33 推薦35 推薦37視頻文章20視頻文章30視頻文章40視頻文章50視頻文章60 視頻文章70視頻文章80視頻文章90視頻文章100視頻文章120視頻文章140 視頻2關鍵字專題關鍵字專題tag2tag3文章專題文章專題2文章索引1文章索引2文章索引3文章索引4文章索引5123456789101112131415文章專題3
        問答文章1 問答文章501 問答文章1001 問答文章1501 問答文章2001 問答文章2501 問答文章3001 問答文章3501 問答文章4001 問答文章4501 問答文章5001 問答文章5501 問答文章6001 問答文章6501 問答文章7001 問答文章7501 問答文章8001 問答文章8501 問答文章9001 問答文章9501
        當前位置: 首頁 - 科技 - 知識百科 - 正文

        微信小程序自定義彈窗wcPop插件

        來源:懂視網 責編:小采 時間:2020-11-27 22:03:43
        文檔

        微信小程序自定義彈窗wcPop插件

        微信小程序自定義彈窗wcPop插件:微信小程序自定義組件彈窗wcPop|小程序消息提示框|toast自定義模板彈窗 平時在開發小程序的時候,彈窗應用場景還是蠻廣泛的,但是微信官方提供的彈窗比較有局限性,不能自定義修改。這個時候首先想到的是自定義組件化開發,就是把彈出框封裝成一個組件,然后
        推薦度:
        導讀微信小程序自定義彈窗wcPop插件:微信小程序自定義組件彈窗wcPop|小程序消息提示框|toast自定義模板彈窗 平時在開發小程序的時候,彈窗應用場景還是蠻廣泛的,但是微信官方提供的彈窗比較有局限性,不能自定義修改。這個時候首先想到的是自定義組件化開發,就是把彈出框封裝成一個組件,然后

        微信小程序自定義組件彈窗wcPop|小程序消息提示框|toast自定義模板彈窗

        平時在開發小程序的時候,彈窗應用場景還是蠻廣泛的,但是微信官方提供的彈窗比較有局限性,不能自定義修改。這個時候首先想到的是自定義組件化開發,就是把彈出框封裝成一個組件,然后多處調用。

        解決了小程序開發自定義彈窗出現后,遮罩層下的頁面仍可以滾動的方法; 給遮罩層的最外層view中加入catchtouchmove=”preventTouchMove” 即可解決該遮罩層點透問題。

        根據需要還可以自定義多個按鈕及事件,另外還新增了仿微信 android、ios彈窗樣式;

        先來展示一些小程序彈窗組件demo圖:

        在需要使用彈窗的頁面引入彈窗js:

        import {wcPop} from '../../utils/component/wcPop/tpl.js';

        /**
         * --------- 小程序彈窗演示函數.Start ---------
         */
         //msg提示
         btnTap01: function(e) {
         wcPop({
         anim: 'fadeIn',
         content: '這里是msg提示框測試(5s后窗口關閉)',
         shade: true,
         shadeClose: false,
         time: 5
         });
         },
        
         //msg提示(黑色背景)
         btnTap02: function(e) {
         wcPop({
         content: '這里是msg提示框測試(2s后窗口關閉)',
         shade: false,
         style: 'background: rgba(17,17,17,.7); color: #fff;',
         time: 2
         });
         },
        
         //信息框
         btnTap03: function(e) {
         var index = wcPop({
         content: '信息框 (這里演示信息框功能效果,這里演示信息框功能效果,這里演示信息框功能效果)',
        
         shadeClose: true,
         anim: 'rollIn',
         xclose: true,
        
         btns: [
         {
         text: '知道了',
         style: 'color: #999',
         onTap() {
         wcPop.close(index);
         console.log("知道了");
         }
         }
         ]
         });
         },
        
         //詢問框
         btnTap04: function(e) {
         wcPop({
         title: '溫馨提示~~~',
         content: '警告,非法操作非法操作非法操作非法操作非法操作非法操作非法操作?。。?,
         shadeClose: false,
         anim: 'shake',
        
         btns: [
         {
         text: '取消',
         onTap() {
         console.log('您點擊了取消!');
         wcPop.close();
         }
         },
         {
         text: '確定',
         style: 'color:#4eca33;',
         onTap() {
         console.log('您點擊了確定!');
         }
         }
         ]
         });
         },
        
         //自定義多按鈕
         btnTap05: function(e) {
         wcPop({
         title: '^-^支付是一種態度',
         content: '尊敬的用戶,我們為您提供了“現金支付”和“微信支付兩種方式”,請選擇一種您的常用支付方式進行支付操作?。。?,
         style: 'border-top:5px solid #4eca33;max-width:90%', //自定義彈窗樣式
         anim: 'fadeInUp',
         opacity: .85,
        
         btns: [
         {
         text: '微信支付',
         style: 'color:#4eca33;',
         onTap() {
         console.log('您選擇了微信支付!');
         }
         },
         {
         text: '支付寶支付',
         style: 'color:#e63d23;',
         onTap() {
         console.log('您選擇了支付寶支付!');
         }
         },
         {
         text: '取消',
         onTap() {
         console.log('您取消了支付請求!');
         wcPop.close();
         }
         }
         ]
         });
         },

        總結

        以上所述是小編給大家介紹的微信小程序自定義彈窗wcPop插件,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復大家的。在此也非常感謝大家對腳本之家網站的支持!

        聲明:本網頁內容旨在傳播知識,若有侵權等問題請及時與本網聯系,我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com

        文檔

        微信小程序自定義彈窗wcPop插件

        微信小程序自定義彈窗wcPop插件:微信小程序自定義組件彈窗wcPop|小程序消息提示框|toast自定義模板彈窗 平時在開發小程序的時候,彈窗應用場景還是蠻廣泛的,但是微信官方提供的彈窗比較有局限性,不能自定義修改。這個時候首先想到的是自定義組件化開發,就是把彈出框封裝成一個組件,然后
        推薦度:
        • 熱門焦點

        最新推薦

        猜你喜歡

        熱門推薦

        專題
        Top
        主站蜘蛛池模板: 亚洲精品视频在线观看视频| 亚洲一区二区三区夜色| 亚洲av色香蕉一区二区三区| 99久久综合国产精品免费| 亚洲午夜精品国产电影在线观看| 免费视频爱爱太爽了| 亚洲国产高清美女在线观看| 久久久久久免费视频| 久久亚洲国产最新网站| 在线a人片天堂免费观看高清| 亚洲精品国产第一综合99久久| 永久黄网站色视频免费直播| 亚洲AV综合永久无码精品天堂| 国产男女猛烈无遮挡免费视频| 老湿机一区午夜精品免费福利| 亚洲JIZZJIZZ中国少妇中文| 皇色在线免费视频| 亚洲电影国产一区| 免费看美女裸露无档网站| 亚洲中文字幕久久精品无码VA| 国产免费观看视频| 精品无码一级毛片免费视频观看| 精品亚洲综合久久中文字幕| 中国人xxxxx69免费视频| 亚洲国产精品18久久久久久| 久久久久噜噜噜亚洲熟女综合| 无码av免费网站| 亚洲欧美国产国产一区二区三区| 日批日出水久久亚洲精品tv| 免费91最新地址永久入口| 亚洲二区在线视频| 亚洲av再在线观看| 91手机看片国产永久免费| AV激情亚洲男人的天堂国语| 亚洲AV无码国产丝袜在线观看| 美女被免费喷白浆视频| 亚洲五月午夜免费在线视频| 精品久久久久久亚洲精品| 亚洲中文字幕无码专区| 午夜免费1000部| 国产特黄一级一片免费|