成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

小程序自定義switch組件

Little_XM / 2134人閱讀

摘要：如上圖，小程序中的組件只能自定義顏色，不能自定義寬高，所以就開始了自己寫組件。自定義組件構(gòu)思從父組件傳來值有高度，寬度，選中時(shí)背景，未選中背景，是否選中的狀態(tài)值寬高單位為。

如上圖，小程序api中的switch組件只能自定義顏色，不能自定義寬高，所以就開始了自己寫switch組件。

自定義組件樣式

switch組件樣式大致如圖，樣式思路：未選中時(shí)為一個(gè)長(zhǎng)方形有圓角按鈕，和一個(gè)半徑為長(zhǎng)方形【（長(zhǎng)方形高度／2）-1】的圓圈，當(dāng)狀態(tài)為選中時(shí)，圓圈向右滾動(dòng)，滾動(dòng)距離為【長(zhǎng)方形寬度-長(zhǎng)方形高度-1】,動(dòng)畫效果通過過渡屬性來賦予的，控制圓圈的left值。

自定義組件構(gòu)思

從父組件傳來值有：高度height，寬度width，選中時(shí)背景bgColor，未選中背景unBgColor，是否選中的狀態(tài)值checked,寬高單位為rpx。

定義了一個(gè)組件方法，點(diǎn)擊時(shí)觸發(fā)該方法執(zhí)行，執(zhí)行后要做的事情交給父組件來處理，并且傳給父組件一個(gè)狀態(tài)值，考慮到在真實(shí)情況下會(huì)進(jìn)行http請(qǐng)求，所以傳了一個(gè)請(qǐng)求成功時(shí)的回調(diào)和失敗時(shí)的回調(diào)。

組件使用

在寫demo時(shí)發(fā)現(xiàn)一個(gè)問題：當(dāng)checked值直接在wxml中寫入false或者是true時(shí)狀態(tài)都為true,只有在js中定義data值為false,才使得狀態(tài)為false,具體原因不造，哪位大大要是知道原因，煩請(qǐng)告知。

！?。№?xiàng)目demo?。?！
附鏈接：wechatide://minicode/ZErlcKmG79Em 在開發(fā)者工具中預(yù)覽

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/116834.html

相關(guān)文章

  • 小程序自定義switch組件

    摘要：如上圖，小程序中的組件只能自定義顏色，不能自定義寬高，所以就開始了自己寫組件。自定義組件構(gòu)思從父組件傳來值有高度，寬度，選中時(shí)背景，未選中背景，是否選中的狀態(tài)值寬高單位為。 showImg(https://segmentfault.com/img/bVbds1i?w=1744&h=926); 如上圖，小程序api中的switch組件只能自定義顏色，不能自定義寬高，所以就開始了自己寫sw...

    icyfire 評(píng)論0 收藏0

  • 小程序自定義switch組件

    摘要：如上圖，小程序中的組件只能自定義顏色，不能自定義寬高，所以就開始了自己寫組件。自定義組件構(gòu)思從父組件傳來值有高度，寬度，選中時(shí)背景，未選中背景，是否選中的狀態(tài)值寬高單位為。 showImg(https://segmentfault.com/img/bVbds1i?w=1744&h=926); 如上圖，小程序api中的switch組件只能自定義顏色，不能自定義寬高，所以就開始了自己寫sw...

    aaron 評(píng)論0 收藏0

  • 小程序采坑記

    摘要：小程序采坑記上手小程序兩個(gè)月，多多少少遇到一些坑，在此簡(jiǎn)單地作下總結(jié)。但一些人可能會(huì)遇過這種情況已知小程序組件默認(rèn)高度，如果子元素高度過高，不會(huì)自適應(yīng)高度。但實(shí)際上真是這樣嗎其實(shí)小程序的組件表現(xiàn)挺奇怪的。擅長(zhǎng)微信小程序開發(fā)，系統(tǒng)管理后臺(tái)。 小程序采坑記 上手小程序兩個(gè)月，多多少少遇到一些坑，在此簡(jiǎn)單地作下總結(jié)。希望能對(duì)那些跟我一樣有遇到過同樣問題的人提供一點(diǎn)幫助，避免掉進(jìn)這些坑，少走一...

    miya 評(píng)論0 收藏0

  • [填坑手冊(cè)]小程序目錄結(jié)構(gòu)和component組件使用心得

    摘要：組件模板與組件數(shù)據(jù)結(jié)合后生成的節(jié)點(diǎn)樹，將被插入到組件的引用位置上。事件用于子組件向父組件傳遞數(shù)據(jù)，可以傳遞任意數(shù)據(jù)。官方文檔往期回顧填坑手冊(cè)小程序生成海報(bào)一拆彈時(shí)刻小程序生成海報(bào)二 showImg(https://user-gold-cdn.xitu.io/2019/6/19/16b6e94bcde767a1?w=1069&h=652&f=jpeg&s=120912); 小程序目錄結(jié)構(gòu)...

    myshell 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<