微信小程式下拉選單自定義元件

介紹

針對於微信小程式做了個下拉選單的自定義元件，樣式如下~

主要包括以下兩種型別

• 級聯選擇器，例如xx區-xx街道
• 下拉選單，例如排序，篩選等

使用

具體使用方式參照index.wxml示例

• 支援動態修改Navgation上的Item數量和顯示隱藏等

/*
dropDownMenuTitle:導航標題陣列，按順序填寫
dropDownMenuDistrictData:區域陣列
--- 以下三種樣式一樣，按需求新增即可 ---
dropDownMenuSourceData:來源
dropDownMenuStyleData:租售
dropDownMenuFilterData:排序
*/
<dropdownmenu dropDownMenuTitle='{{dropDownMenuTitle}}' dropDownMenuDistrictData='{{dropDownMenuFirstData}}' dropDownMenuSourceData='{{dropDownMenuSecondData}}' dropDownMenuStyleData='{{dropDownMenuThirdData}}' dropDownMenuFilterData='{{dropDownMenuFourthData}}'
  bind:selectedItem='selectedItem' />
複製程式碼

• 將專案中component資料夾拖入專案中
• 在將要使用的該元件的.json檔案中引入

{
  "usingComponents": {
    "dropdownmenu": "/component/dropdownmenu/dropdownmenu"
  }
}

複製程式碼

• 在.wxml檔案中引用即可

github連結在最下方，詳情程式碼以及使用參照示例，如果對你有所幫助的請給個Star✨~

專案地址 - https://github.com/ZBK1nger/dropDownMenu-wechat