小程式中元件公用屬性和data 的使用

2022-05-06 10:39:11 字數 973 閱讀 2781

屬性名                型別                   描述                              註解  

hidden                boolean             元件是否顯示               所有元件預設顯示

data-*                 any                    自定義屬性                   元件上觸發的事件時,會傳送給事件處理函式

bind* / catch*     eventhandler    元件的事件                   

具體詳情見:

小程式中, 要想實現資料的傳輸,我們必須先要在data中設定資料,然後才能進行傳輸,那麼,data-的具體使用是:

在wxml檔案乙個標籤中,bindtap乙個事件,然後寫上 data-*,這個 * 是自己定義的名稱,則,在js檔案的bindtap事件中,傳入 e(event),則:e(

event).currenttarget.dataset.定義的data-後的名字

則為data-攜帶要傳的資料,其中,currenttarget是你當前點選的物件,dataset就是你自定義屬性的集合,例如在這裡就是 data-

index = "}",紅色index是自定義的名字,橘色的是傳的引數

示例:wxml檔案

.js檔案

這個js檔案中的 e(event).currenttarget.dataset.index 

裡的 index 就相當於是在data-index中的傳遞的 index 的定義的引數名字

大家也可以參考這個: 

怎麼使用小程式的data 屬性?

在元件中可以定義資料,這些資料將會通過事件傳遞給 service。書寫方式 以data 開頭,多個單詞由連字元 鏈結,不能有大寫 大寫會自動轉成小寫 如data element type,最終在 event.currenttarget.dataset 中會將連字元轉成駝峰elementtype。示例...

微信小程式中公用內容

在util.js檔案中 跳轉 function go where 將方法暴露出去,在其他頁面才可以呼叫 module.exports 在其他頁面呼叫 引入util.js var utils require utils util.js page import include 在頁面中引入wxml in...

小程式 自定義元件 屬性值 微信小程式 基礎元件

框架為開發者提供了一系列基礎元件,開發者可以通過組合這些基礎元件進行快速開發。詳細介紹請參考元件文件。什麼是元件 content goes here tagname 注意 所有元件與屬性都是小寫,以連字元 連線 型別描述 註解boolean 布林值元件寫上該屬性,不管是什麼值都被當作true 只有元...