日韩无码专区无码一级三级片|91人人爱网站中日韩无码电影|厨房大战丰满熟妇|AV高清无码在线免费观看|另类AV日韩少妇熟女|中文日本大黄一级黄色片|色情在线视频免费|亚洲成人特黄a片|黄片wwwav色图欧美|欧亚乱色一区二区三区

RELATEED CONSULTING
相關咨詢
選擇下列產(chǎn)品馬上在線溝通
服務時間：8:30-17:00
你可能遇到了下面的問題
關閉右側工具欄

新聞中心

這里有您想知道的互聯(lián)網(wǎng)營銷解決方案
創(chuàng)新互聯(lián)百度小程序教程：使用組件注意事項
  • 使用組件注意事項
    • button 組件
    • label 組件
    • 常見問題
      • Q：為什么 label 組件不支持綁定 input 組件和 textarea 組件？
  • switch 組件
  • textarea組件
  • 表單校驗
  • 組合能力示例

    使用組件注意事項

    在使用小程序組件的時候，有一些開發(fā)實現(xiàn)的問題需要被注意。

    為革吉等地區(qū)用戶提供了全套網(wǎng)頁設計制作服務，及革吉網(wǎng)站建設行業(yè)解決方案。主營業(yè)務為成都做網(wǎng)站、成都網(wǎng)站建設、革吉網(wǎng)站設計，以傳統(tǒng)方式定制建設網(wǎng)站，并提供域名空間備案等一條龍服務，秉承以專業(yè)、用心的態(tài)度為用戶提供真誠的服務。我們深信只要達到每一位用戶的要求，就會得到認可，從而選擇與我們長期合作。這樣，我們也可以走得更遠！

    button 組件

    為了處理移動端的 1px 問題，默認類型的 button 組件在設置邊框樣式時使用了偽類。
    場景：需要設置 button 邊框樣式覆蓋默認樣式。
    解決方法：開發(fā)者可以通過偽類設置樣式來覆蓋默認的邊框樣式。

    代碼示例

    • SWAN
    • CSS
     
 
 
      
  
  
  
      2. 
  
  
  
    2.  按鈕 default
      3. 
  
  
  
      4. 
 
 
 
     
 
 
      
  
  
  
    1. .btn {
      2. 
  
  
  
    2.  position: absolute;
      3. 
  
  
  
    3.  top: 50px;
      4. 
  
  
  
    4. }
      5. 
  
  
  
    5. .btn:after {
      6. 
  
  
  
    6.  border: 1px solid #f00;
      7. 
  
  
  
    7. }
      8.

    label 組件

    label 組件使用 for 屬性找到對應的 ID（必須寫 for），當點擊時，就會觸發(fā)對應的控件。目前可以綁定的控件有：button、checkbox、radio、switch 。
    場景：button/checkbox/radio/switch 組件較小的時候，可點擊區(qū)域變小，導致用戶體驗不好。
    解決方法：使用 label 組件包裹，通過控制 label 組件的寬高，可以擴大控制熱區(qū)。

    代碼示例

    • SWAN
    • CSS
     
 
 
      
  
  
  
      2. 
  
  
  
    2.  
      3. 
  
  
  
    3.  智能小程序
      4. 
  
  
  
      5. 
 
 
 
     
 
 
      
  
  
  
    1. .label {
      2. 
  
  
  
    2.  display: block;
      3. 
  
  
  
    3.  padding: .2rem;
      4. 
  
  
  
    4. }
      5.

    常見問題

    Q：為什么 label 組件不支持綁定 input 組件和 textarea 組件？

    A：這是因為為了提供更加豐富的功能和更接近于原生的體驗，input 和 textarea 是通過原生組件的形式實現(xiàn)的，關于原生組件具體可以參考原生組件說明，而 label 是非原生組件，因此暫時不支持綁定 input 組件和 textarea 組件。

    switch 組件

    switch 組件默認大小為 38px * 23px ，但不能通過設置 width 和 height 進行調整。
    場景：開發(fā)者想調整 switch 組件的大小，直接設置 width 和 height 沒有效果。
    解決方法：可以通過 CSS scale 縮放進行設置。

    代碼示例

    • CSS
     
 
 
      
  
  
  
    1. swan-switch {
      2. 
  
  
  
    2.  /* 通過縮放調整大小 */
      3. 
  
  
  
    3.  transform: scale(.5);
      4. 
  
  
  
    4.  /* 圖標寬度并不會改變 */
      5. 
  
  
  
    5.  /* width: 1.1rem; */
      6. 
  
  
  
    6. }
      7.

    textarea組件

    textarea 的 blur 事件會晚于頁面上的 tap 事件。
    場景：有一個表單（textarea + button），獲取表單內容用的是 bindblur 事件。因為 textarea 的 blur 事件會晚于頁面上的 tap 事件，所以輸入內容后立即點擊 button 是不能獲得數(shù)據(jù)的。
    解決方法：可以使用 form 的 bindsubmit 。

    代碼示例

    • SWAN
    • JS
     
 
 
      
  
  
  
      2. 
  
  
  
    2.  
      3. 
  
  
  
    3.