m8-mcp-server 1.0.1 → 1.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (164) hide show
  1. package/README.md +118 -32
  2. package/dist/index.d.mts +449 -0
  3. package/dist/index.d.ts +449 -0
  4. package/dist/index.js +700 -1
  5. package/dist/index.mjs +700 -0
  6. package/package.json +34 -21
  7. package/prompts/PROMPTS.md +476 -0
  8. package/bin/m8-mcp.js +0 -2
  9. package/dist/constants.js +0 -1
  10. package/dist/data/ejs-doc/api_audio/api_audio.md +0 -225
  11. package/dist/data/ejs-doc/api_auth/api_auth.md +0 -256
  12. package/dist/data/ejs-doc/api_contact/api_contact.md +0 -295
  13. package/dist/data/ejs-doc/api_contact/images/component_contact.jpg +0 -0
  14. package/dist/data/ejs-doc/api_device/api_device.md +0 -761
  15. package/dist/data/ejs-doc/api_event/api_event.md +0 -244
  16. package/dist/data/ejs-doc/api_global/api_global.md +0 -440
  17. package/dist/data/ejs-doc/api_io/api_io.md +0 -369
  18. package/dist/data/ejs-doc/api_navigator/api_navigator.md +0 -654
  19. package/dist/data/ejs-doc/api_navigator/images/navigator.backbtn.png +0 -0
  20. package/dist/data/ejs-doc/api_navigator/images/navigator.hide.png +0 -0
  21. package/dist/data/ejs-doc/api_navigator/images/navigator.hidestatus.png +0 -0
  22. package/dist/data/ejs-doc/api_navigator/images/navigator.leftarrowbtn.jpg +0 -0
  23. package/dist/data/ejs-doc/api_navigator/images/navigator.leftbtn.png +0 -0
  24. package/dist/data/ejs-doc/api_navigator/images/navigator.leftbtnimg.png +0 -0
  25. package/dist/data/ejs-doc/api_navigator/images/navigator.multititle.jpg +0 -0
  26. package/dist/data/ejs-doc/api_navigator/images/navigator.rightbtn.png +0 -0
  27. package/dist/data/ejs-doc/api_navigator/images/navigator.rightbtn2.png +0 -0
  28. package/dist/data/ejs-doc/api_navigator/images/navigator.rightbtnimg.png +0 -0
  29. package/dist/data/ejs-doc/api_navigator/images/navigator.rightbtnimg2.png +0 -0
  30. package/dist/data/ejs-doc/api_navigator/images/navigator.rightmenu.png +0 -0
  31. package/dist/data/ejs-doc/api_navigator/images/navigator.searchbar.png +0 -0
  32. package/dist/data/ejs-doc/api_navigator/images/navigator.subtitle.jpg +0 -0
  33. package/dist/data/ejs-doc/api_navigator/images/navigator.title.png +0 -0
  34. package/dist/data/ejs-doc/api_page/api_page.md +0 -261
  35. package/dist/data/ejs-doc/api_runtime/api_runtime.md +0 -788
  36. package/dist/data/ejs-doc/api_storage/api_storage.md +0 -320
  37. package/dist/data/ejs-doc/api_stream/api_stream.md +0 -152
  38. package/dist/data/ejs-doc/api_stream/images/body_multiform.jpg +0 -0
  39. package/dist/data/ejs-doc/api_ui/api_ui.md +0 -836
  40. package/dist/data/ejs-doc/api_ui/images/ui.popwindow.png +0 -0
  41. package/dist/data/ejs-doc/api_ui/images/ui_actionsheet.png +0 -0
  42. package/dist/data/ejs-doc/api_ui/images/ui_alert.png +0 -0
  43. package/dist/data/ejs-doc/api_ui/images/ui_confirm.png +0 -0
  44. package/dist/data/ejs-doc/api_ui/images/ui_pickDateTime.png +0 -0
  45. package/dist/data/ejs-doc/api_ui/images/ui_pickdate.png +0 -0
  46. package/dist/data/ejs-doc/api_ui/images/ui_pickmonth.png +0 -0
  47. package/dist/data/ejs-doc/api_ui/images/ui_picktime.png +0 -0
  48. package/dist/data/ejs-doc/api_ui/images/ui_poppicker.png +0 -0
  49. package/dist/data/ejs-doc/api_ui/images/ui_poppicker2.png +0 -0
  50. package/dist/data/ejs-doc/api_ui/images/ui_poppicker3.png +0 -0
  51. package/dist/data/ejs-doc/api_ui/images/ui_prompt.png +0 -0
  52. package/dist/data/ejs-doc/api_ui/images/ui_select.png +0 -0
  53. package/dist/data/ejs-doc/api_ui/images/ui_select2.png +0 -0
  54. package/dist/data/ejs-doc/api_ui/images/ui_select3.png +0 -0
  55. package/dist/data/ejs-doc/api_ui/images/ui_showdebugdialog.png +0 -0
  56. package/dist/data/ejs-doc/api_ui/images/ui_showwaiting.png +0 -0
  57. package/dist/data/ejs-doc/api_ui/images/ui_toast.png +0 -0
  58. package/dist/data/ejs-doc/api_ui/images/ui_toastAndEvent.png +0 -0
  59. package/dist/data/ejs-doc/api_util/api_util.md +0 -615
  60. package/dist/data/ejs-doc/api_util/images/util.playvideo.png +0 -0
  61. package/dist/data/ejs-doc/api_util/images/util.previmage.png +0 -0
  62. package/dist/data/ejs-doc/api_util/images/util.selectfile.png +0 -0
  63. package/dist/data/ejs-doc/api_util/images/util.selectimage.png +0 -0
  64. package/dist/data/m8mpdoc-develop/003-/345/205/270/345/236/213/346/241/210/344/276/213/003-/345/210/227/350/241/250/350/257/246/346/203/205.md +0 -247
  65. package/dist/data/m8mpdoc-develop/003-/345/205/270/345/236/213/346/241/210/344/276/213/003-/345/210/227/350/241/250/350/257/246/346/203/205vue3.md +0 -276
  66. package/dist/data/m8mpdoc-develop/003-/345/205/270/345/236/213/346/241/210/344/276/213/003-/350/241/250/345/215/225/346/217/220/344/272/244.md +0 -130
  67. package/dist/data/m8mpdoc-develop/003-/345/205/270/345/236/213/346/241/210/344/276/213/003-/350/241/250/345/215/225/346/217/220/344/272/244vue3.md +0 -115
  68. package/dist/data/m8mpdoc-develop/005-/346/240/270/345/277/203/351/200/232/347/224/250Util/000-/346/240/270/345/277/203/346/226/271/346/263/225.md +0 -398
  69. package/dist/data/m8mpdoc-develop/005-/346/240/270/345/277/203/351/200/232/347/224/250Util/001-Ajax/344/270/216/346/226/207/344/273/266/344/270/212/344/274/240.md +0 -456
  70. package/dist/data/m8mpdoc-develop/006-Util/345/267/245/345/205/267/351/233/206/000-charset.md +0 -128
  71. package/dist/data/m8mpdoc-develop/006-Util/345/267/245/345/205/267/351/233/206/001-base64.md +0 -142
  72. package/dist/data/m8mpdoc-develop/006-Util/345/267/245/345/205/267/351/233/206/002-date.md +0 -210
  73. package/dist/data/m8mpdoc-develop/006-Util/345/267/245/345/205/267/351/233/206/004-math.md +0 -85
  74. package/dist/data/m8mpdoc-develop/006-Util/345/267/245/345/205/267/351/233/206/006-sha1.md +0 -21
  75. package/dist/data/m8mpdoc-develop/006-Util/345/267/245/345/205/267/351/233/206/007-sha256.md +0 -36
  76. package/dist/data/m8mpdoc-develop/006-Util/345/267/245/345/205/267/351/233/206/008-storage.md +0 -128
  77. package/dist/data/m8mpdoc-develop/006-Util/345/267/245/345/205/267/351/233/206/009-string.md +0 -148
  78. package/dist/data/m8mpdoc-develop/006-Util/345/267/245/345/205/267/351/233/206/010-Util/346/211/251/345/261/225/346/214/207/345/215/227.md +0 -76
  79. package/dist/data/m8mpdoc-develop/006-Util/345/267/245/345/205/267/351/233/206/011-cookie.md +0 -59
  80. package/dist/data/m8mpdoc-develop/006-Util/345/267/245/345/205/267/351/233/206/012-util-sm.md +0 -95
  81. package/dist/data/m8mpdoc-develop/006-Util/345/267/245/345/205/267/351/233/206/013-1.baseapi.md +0 -76
  82. package/dist/data/m8mpdoc-develop/006-Util/345/267/245/345/205/267/351/233/206/013-2.network.md +0 -202
  83. package/dist/data/m8mpdoc-develop/006-Util/345/267/245/345/205/267/351/233/206/013-2.socketTask.md +0 -92
  84. package/dist/data/m8mpdoc-develop/006-Util/345/267/245/345/205/267/351/233/206/013-3.uiapi.md +0 -412
  85. package/dist/data/m8mpdoc-develop/006-Util/345/267/245/345/205/267/351/233/206/013-4.eventapi.md +0 -146
  86. package/dist/data/m8mpdoc-develop/006-Util/345/267/245/345/205/267/351/233/206/013-5.otherapi.md +0 -137
  87. package/dist/data/m8mpdoc-develop/006-Util/345/267/245/345/205/267/351/233/206/014-util-mpVerifyManager.md +0 -363
  88. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/000-/347/273/204/344/273/266/345/272/223/344/270/213/350/275/275/344/275/277/347/224/250.md +0 -188
  89. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/001-actionsheet/345/212/250/344/275/234/351/235/242/346/235/277.md +0 -460
  90. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/004-amap/345/234/260/345/233/276.md +0 -285
  91. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/005-button/346/214/211/351/222/256.md +0 -211
  92. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/008-cell/345/215/225/345/205/203/346/240/274.md +0 -213
  93. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/009-checkbox/345/244/215/351/200/211/346/241/206.md +0 -501
  94. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/010-circle/347/216/257/345/275/242/350/277/233/345/272/246/346/235/241.md +0 -168
  95. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/011-datepicker/346/227/245/346/234/237/351/200/211/346/213/251.md +0 -617
  96. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/013-field/350/276/223/345/205/245/346/241/206.md +0 -539
  97. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/015-form/350/241/250/345/215/225.md +0 -999
  98. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/018-header/345/244/264/351/203/250/345/257/274/350/210/252/346/240/217.md +0 -150
  99. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/019-icon/345/233/276/346/240/207.md +0 -133
  100. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/020-loading/345/212/240/350/275/275.md +0 -117
  101. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/021-noticebar/351/200/232/347/237/245/346/240/217.md +0 -152
  102. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/022-numberkeyboard/346/225/260/345/255/227/351/224/256/347/233/230.md +0 -427
  103. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/023-pagination/345/210/206/351/241/265.md +0 -212
  104. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/024-panel/351/235/242/346/235/277.md +0 -85
  105. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/025-passwordinput/345/257/206/347/240/201/350/276/223/345/205/245/346/241/206.md +0 -175
  106. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/026-picker/351/200/211/346/213/251/345/231/250.md +0 -519
  107. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/027-popup/345/274/271/345/207/272/345/261/202.md +0 -152
  108. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/028-progress/350/277/233/345/272/246/346/235/241.md +0 -103
  109. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/029-radio/345/215/225/351/200/211/346/241/206.md +0 -285
  110. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/030-rate/350/257/204/345/210/206.md +0 -189
  111. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/031-search/346/220/234/347/264/242.md +0 -217
  112. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/032-slider/346/273/221/345/235/227.md +0 -166
  113. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/033-stepper/346/255/245/350/277/233/345/231/250.md +0 -340
  114. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/035-swipecell/346/273/221/345/212/250/345/215/225/345/205/203/346/240/274.md +0 -265
  115. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/036-switch/345/274/200/345/205/263.md +0 -196
  116. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/037-switchcell/345/274/200/345/205/263/345/215/225/345/205/203/346/240/274.md +0 -115
  117. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/038-tag/346/240/207/350/256/260.md +0 -232
  118. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/039-treeselect/345/210/206/347/261/273/351/200/211/346/213/251.md +0 -631
  119. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/040-uploader/346/226/207/344/273/266/344/270/212/344/274/240.md +0 -531
  120. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/041-verifycode/351/252/214/350/257/201/347/240/201.md +0 -111
  121. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/042-minirefresh/344/270/213/346/213/211/345/210/267/346/226/260.md +0 -337
  122. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/043-layout/345/270/203/345/261/200.md +0 -150
  123. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/044-image/345/233/276/347/211/207.md +0 -144
  124. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/045-toast/350/275/273/346/217/220/347/244/272.md +0 -429
  125. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/046-calendar/346/227/245/345/216/206.md +0 -467
  126. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/047-area/347/234/201/345/270/202/345/214/272/351/200/211/346/213/251.md +0 -295
  127. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/048-tab/346/240/207/347/255/276/351/241/265.md +0 -577
  128. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/049-dialog/345/274/271/345/207/272/346/241/206.md +0 -491
  129. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/050-dropdownmenu/344/270/213/346/213/211/350/217/234/345/215/225.md +0 -265
  130. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/051-notify/346/266/210/346/201/257/351/200/232/347/237/245.md +0 -203
  131. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/052-overlay/351/201/256/347/275/251/345/261/202.md +0 -139
  132. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/053-collapse/346/212/230/345/217/240/351/235/242/346/235/277.md +0 -199
  133. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/054-grid/345/256/253/346/240/274.md +0 -183
  134. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/055-countdown/345/200/222/350/256/241/346/227/266.md +0 -289
  135. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/056-divider/345/210/206/345/211/262/347/272/277.md +0 -97
  136. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/057-empty/347/251/272/347/212/266/346/200/201.md +0 -146
  137. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/058-imagepreview/345/233/276/347/211/207/351/242/204/350/247/210.md +0 -292
  138. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/059-lazyload/346/207/222/345/212/240/350/275/275.md +0 -120
  139. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/060-skeleton/351/252/250/346/236/266/345/261/217.md +0 -114
  140. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/061-steps/346/255/245/351/252/244/346/235/241.md +0 -119
  141. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/062-sticky/347/262/230/346/200/247/345/270/203/345/261/200.md +0 -208
  142. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/063-indexbar/347/264/242/345/274/225/346/240/217.md +0 -161
  143. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/064-sidebar/344/276/247/350/276/271/345/257/274/350/210/252.md +0 -248
  144. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/065-tabbar/346/240/207/347/255/276/346/240/217.md +0 -314
  145. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/066-badge/345/276/275/346/240/207.md +0 -162
  146. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/067-popover/346/260/224/346/263/241/345/274/271/345/207/272/346/241/206.md +0 -325
  147. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/068-cascader/347/272/247/350/201/224/351/200/211/346/213/251.md +0 -360
  148. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/069-selectperson/351/200/211/344/272/272/347/273/204/344/273/266.md +0 -595
  149. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/070-swipe/350/275/256/346/222/255.md +0 -262
  150. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/071-/345/233/275/351/231/205/345/214/226.md +0 -51
  151. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/072-easycalendar/346/227/245/345/216/206.md +0 -132
  152. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/073-qrcode/344/272/214/347/273/264/347/240/201.md +0 -1538
  153. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/074-imagescale/345/233/276/347/211/207/350/243/201/345/211/252.md +0 -261
  154. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/075-dragsort/346/213/226/346/213/275/346/216/222/345/272/217.md +0 -161
  155. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/076-chart/345/233/276/350/241/250.md +0 -381
  156. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/077-rtc/351/237/263/350/247/206/351/242/221.md +0 -531
  157. package/dist/data/m8mpdoc-develop/009-UI/347/273/204/344/273/266/078-table/350/241/250/346/240/274.md +0 -849
  158. package/dist/data/m8mpdoc-develop/012-Mock/347/232/204/344/275/277/347/224/250/Mock/347/232/204/344/275/277/347/224/250.md +0 -116
  159. package/dist/data/standards/css-style.md +0 -531
  160. package/dist/data/standards/js-style.md +0 -394
  161. package/dist/data/standards/project-structure.md +0 -325
  162. package/dist/data/standards/vue-style.md +0 -644
  163. package/dist/tools/search.js +0 -1
  164. package/dist/tools/standards.js +0 -1
@@ -1,519 +0,0 @@
1
- # 组件使用
2
-
3
- ## picker 选择器
4
-
5
- ### 介绍
6
-
7
- - 提供多个选项集合供用户选择,支持单列选择和多列级联。
8
-
9
- ### 代码演示
10
-
11
- #### 基础用法
12
-
13
- **选项配置**
14
- `Picker` 组件通过`columns`属性配置选项数据,`columns`是一个包含字符串或对象的数组。
15
-
16
- **顶部栏**
17
- 设置`show-toolbar`属性后会展示顶部操作栏,顶部栏包含标题、确认按钮和取消按钮,点击确认按钮触发`confirm`事件,点击取消按钮触发`cancel`事件
18
-
19
- ::: ifdef M83
20
-
21
- ```html
22
- <em-picker
23
- v-model="showPicker"
24
- title="标题"
25
- show-toolbar
26
- :columns="columns"
27
- @confirm="onConfirm"
28
- @cancel="onCancel"
29
- @change="onChange"
30
- />
31
- <em-toast ref="emToast"></em-toast>
32
- ```
33
-
34
- ```js
35
- export default {
36
- data() {
37
- return {
38
- showPicker: false,
39
- columns: ['杭州', '宁波', '温州', '绍兴', '湖州', '嘉兴', '金华', '衢州']
40
- };
41
- },
42
- methods: {
43
- onConfirm(value, index) {
44
- Toast({
45
- zIndex: 3000,
46
- message: `Value: ${value}, Index:${index}`
47
- });
48
- },
49
- onChange(picker, value, index) {
50
- Toast({
51
- zIndex: 3000,
52
- message: `Value: ${value}, Index:${index}`
53
- });
54
- },
55
- onCancel() {
56
- Toast({
57
- zIndex: 3000,
58
- message: '取消'
59
- });
60
- }
61
- }
62
- };
63
- ```
64
-
65
- ::: endif
66
- ::: ifdef M84
67
-
68
- ```html
69
- <em-picker
70
- v-model="showPicker"
71
- title="标题"
72
- show-toolbar
73
- :columns="columns"
74
- @confirm="onConfirm"
75
- @cancel="onCancel"
76
- @change="onChange"
77
- />
78
- <em-toast ref="emToastRef"></em-toast>
79
- ```
80
-
81
- ```js
82
- import { ref } from 'vue';
83
- const showPicker = ref(false);
84
- const columns = ref(['杭州', '宁波', '温州', '绍兴', '湖州', '嘉兴', '金华', '衢州']);
85
-
86
- const onConfirm = (value, index) => {
87
- Toast({
88
- zIndex: 3000,
89
- message: `Value: ${value}, Index:${index}`
90
- });
91
- };
92
-
93
- const onChange = (picker, value, index) => {
94
- Toast({
95
- zIndex: 3000,
96
- message: `Value: ${value}, Index:${index}`
97
- });
98
- };
99
-
100
- const onCancel = () => {
101
- Toast({
102
- zIndex: 3000,
103
- message: '取消'
104
- });
105
- };
106
-
107
- const emToastRef = ref(null);
108
-
109
- defineExpose({
110
- emToastRef
111
- });
112
- ```
113
-
114
- ::: endif
115
-
116
- #### 默认选中项
117
-
118
- 单列选择时,可以通过`default-index`属性设置初始选中项的索引
119
-
120
- ```html
121
- <em-picker show-toolbar title="标题" :columns="columns" :default-index="2" />
122
- ```
123
-
124
- #### 多列选择
125
-
126
- `columns`属性可以通过对象数组的形式配置多列选择,对象中可以配置选项数据、初始选中项等,详细格式见下方表格。
127
-
128
- ```html
129
- <em-picker show-toolbar title="标题" :columns="column7" />
130
- ```
131
-
132
- ::: ifdef M83
133
-
134
- ```js
135
- export default {
136
- data() {
137
- return {
138
- column7: [
139
- // 第一列
140
- {
141
- values: ['周一', '周二', '周三', '周四', '周五'],
142
- defaultIndex: 2
143
- },
144
- // 第二列
145
- {
146
- values: ['上午', '下午', '晚上'],
147
- defaultIndex: 1
148
- }
149
- ]
150
- };
151
- }
152
- };
153
- ```
154
-
155
- ::: endif
156
- ::: ifdef M84
157
-
158
- ```js
159
- import { ref } from 'vue';
160
- const column7 = ref([
161
- // 第一列
162
- {
163
- values: ['周一', '周二', '周三', '周四', '周五'],
164
- defaultIndex: 2
165
- },
166
- // 第二列
167
- {
168
- values: ['上午', '下午', '晚上'],
169
- defaultIndex: 1
170
- }
171
- ]);
172
- ```
173
-
174
- ::: endif
175
-
176
- #### 级联选择
177
-
178
- 使用`columns`的`children`字段可以实现选项级联的效果。
179
-
180
- ```html
181
- <em-picker show-toolbar title="标题" :columns="column8" />
182
- ```
183
-
184
- ::: ifdef M83
185
-
186
- ```js
187
- export default {
188
- data() {
189
- return {
190
- column8: [
191
- {
192
- text: '浙江',
193
- children: [
194
- {
195
- text: '杭州',
196
- children: [{ text: '西湖区' }, { text: '余杭区' }]
197
- },
198
- {
199
- text: '温州',
200
- children: [{ text: '鹿城区' }, { text: '瓯海区' }]
201
- }
202
- ]
203
- },
204
- {
205
- text: '福建',
206
- children: [
207
- {
208
- text: '福州',
209
- children: [{ text: '鼓楼区' }, { text: '台江区' }]
210
- },
211
- {
212
- text: '厦门',
213
- children: [{ text: '思明区' }, { text: '海沧区' }]
214
- }
215
- ]
216
- }
217
- ]
218
- };
219
- }
220
- };
221
- ```
222
-
223
- ::: endif
224
- ::: ifdef M84
225
-
226
- ```js
227
- import { ref } from 'vue';
228
- const column8 = ref([
229
- {
230
- text: '浙江',
231
- children: [
232
- {
233
- text: '杭州',
234
- children: [{ text: '西湖区' }, { text: '余杭区' }]
235
- },
236
- {
237
- text: '温州',
238
- children: [{ text: '鹿城区' }, { text: '瓯海区' }]
239
- }
240
- ]
241
- },
242
- {
243
- text: '福建',
244
- children: [
245
- {
246
- text: '福州',
247
- children: [{ text: '鼓楼区' }, { text: '台江区' }]
248
- },
249
- {
250
- text: '厦门',
251
- children: [{ text: '思明区' }, { text: '海沧区' }]
252
- }
253
- ]
254
- }
255
- ]);
256
- ```
257
-
258
- ::: endif
259
-
260
- 级联选择的数据嵌套深度需要保持一致,如果部分选项没有子选项,可以使用空字符串进行占位
261
-
262
- #### 禁用选项
263
-
264
- 选项可以为对象结构,通过设置 `disabled` 来禁用该选项
265
-
266
- ```html
267
- <em-picker show-toolbar :columns="column2" />
268
- ```
269
-
270
- ::: ifdef M83
271
-
272
- ```js
273
- export default {
274
- data() {
275
- return {
276
- column2: [{ text: '杭州', disabled: true }, { text: '宁波' }, { text: '温州' }]
277
- };
278
- }
279
- };
280
- ```
281
-
282
- ::: endif
283
- ::: ifdef M84
284
-
285
- ```js
286
- import { ref } from 'vue';
287
-
288
- const column2 = ref([{ text: '杭州', disabled: true }, { text: '宁波' }, { text: '温州' }]);
289
- ```
290
-
291
- ::: endif
292
-
293
- #### 动态设置选项
294
-
295
- 通过 `Picker` 上的实例方法可以更灵活地控制选择器,比如使用`setColumnValues`方法实现多列联动
296
-
297
- ```html
298
- <em-picker show-toolbar :columns="column4" @change="onChange" />
299
- ```
300
-
301
- ::: ifdef M83
302
-
303
- ```js
304
- const cities = {
305
- 浙江: ['杭州', '宁波', '温州', '嘉兴', '湖州'],
306
- 福建: ['福州', '厦门', '莆田', '三明', '泉州']
307
- };
308
-
309
- export default {
310
- data() {
311
- return {
312
- column4: [{ values: Object.keys(cities) }, { values: cities['浙江'] }]
313
- };
314
- },
315
- methods: {
316
- onChange(picker, values) {
317
- picker.setColumnValues(1, cities[values[0]]);
318
- }
319
- }
320
- };
321
- ```
322
-
323
- ::: endif
324
- ::: ifdef M84
325
-
326
- ```js
327
- import { ref } from 'vue';
328
- const cities = {
329
- 浙江: ['杭州', '宁波', '温州', '嘉兴', '湖州'],
330
- 福建: ['福州', '厦门', '莆田', '三明', '泉州']
331
- };
332
-
333
- const column4 = ref([
334
- {
335
- values: Object.keys(cities)
336
- },
337
- {
338
- values: cities['浙江']
339
- }
340
- ]);
341
-
342
- const onChange = (picker, values) => {
343
- picker.setColumnValues(1, cities[values[0]]);
344
- };
345
- ```
346
-
347
- ::: endif
348
-
349
- #### 加载状态
350
-
351
- 若选择器数据是异步获取的,可以通过 `loading` 属性显示加载提示
352
-
353
- ```html
354
- <em-picker v-model="show6" show-toolbar :columns="columns" :loading="loading" />
355
- ```
356
-
357
- ::: ifdef M83
358
-
359
- ```js
360
- export default {
361
- data() {
362
- return {
363
- column6: [],
364
- show6: false,
365
- loading: true
366
- };
367
- },
368
- created() {
369
- setTimeout(() => {
370
- this.loading = false;
371
- this.column6 = ['选项'];
372
- }, 1000);
373
- }
374
- };
375
- ```
376
-
377
- ::: endif
378
- ::: ifdef M84
379
-
380
- ```js
381
- import { ref } from 'vue';
382
- const show6 = ref(false);
383
- const loading = ref(true);
384
- const column6 = ref([]);
385
-
386
- setTimeout(() => {
387
- loading.value = false;
388
- column6.value = ['选项'];
389
- }, 1000);
390
- ```
391
-
392
- ::: endif
393
-
394
- ### API
395
-
396
- #### Picker Props
397
-
398
- | 参数 | 说明 | 类型 | 默认值 |
399
- | :--------------------------------------------------------------------------- | :--------------------------------------------------: | :-------------- | :------ |
400
- | v-model ::: ifdef M83 (value) ::: endif ::: ifdef M84 (modelValue) ::: endif | 选择器的显隐 | boolean | `false` |
401
- | columns | 对象数组,配置每一列显示的数据 | Column[] | `[]` |
402
- | title | 顶部栏标题 | string | - |
403
- | confirm-button-text | 确认按钮文字 | string | `确认` |
404
- | cancel-button-text | 取消按钮文字 | string | `取消` |
405
- | value-key | 选项对象中,选项文字对应的键名 | string | `text` |
406
- | toolbar-position | 顶部栏位置,可选值为`bottom` | string | `top` |
407
- | loading | 是否显示加载状态 | boolean | `false` |
408
- | readonly | 是否为只读状态,只读状态下无法切换选项 | boolean | `false` |
409
- | show-toolbar | 是否显示顶部栏 | boolean | `false` |
410
- | default-index | 单列选择时,默认选中项的索引 | number / string | `0` |
411
- | item-height | 选项高度,支持 `px` `vw` `rem` 单位,默认 `px` | number / string | `44` |
412
- | visible-item-count | 可见的选项个数 | number / string | `6` |
413
- | swipe-duration | 快速滑动时惯性滚动的时长,单位 `ms`, 该值必须大于`0` | number / string | `300` |
414
-
415
- #### Popup Props
416
-
417
- 选择器组件已经包裹了`popup`组件,故也支持传递`popup`组件的部分`props`。相关`props`的具体示例请参考`popup`组件章节。
418
-
419
- | 参数 | 说明 | 类型 | 默认值 |
420
- | :--------------------- | :---------------------------------------: | :------ | :----- |
421
- | overlay | 是否显示遮罩层 | boolean | `true` |
422
- | overlay-class | 自定义遮罩层类名 | string | - |
423
- | overlay-style | 自定义遮罩层样式 | object | - |
424
- | transition | 动画类名,等价于 `transtion` 的`name`属性 | string | - |
425
- | close-on-click-overlay | 是否在点击遮罩层后关闭 | boolean | `true` |
426
- | lock-scroll | 是否锁定背景滚动 | boolean | `true` |
427
-
428
- 注意,其中`transition`属性组件库支持的可选值有:`em-fade` `em-fade-up` `em-fade-down` `em-fade-left` `em-fade-right` `em-slide-up` `em-slide-down` `em-slide-left` `em-slide-right`
429
-
430
- #### Picker Events
431
-
432
- 当选择器有多列时,事件回调参数会返回数组
433
-
434
- | 事件名 | 说明 | 回调参数 |
435
- | :------ | :----------------: | :------------------------------------------------------------------------ |
436
- | confirm | 点击完成按钮时触发 | 单列:选中值,选中值对应的索引,多列:所有列选中值,所有列选中值对应的索引 |
437
- | cancel | 点击取消按钮时触发 | 单列:选中值,选中值对应的索引,多列:所有列选中值,所有列选中值对应的索引 |
438
- | change | 选项改变时触发 | 单列:选中值,选中值对应的索引,多列:所有列选中值,当前列对应的索引 |
439
-
440
- #### Popup Events
441
-
442
- 时间选择组件已经包裹了`popup`组件,故也支持`popup`组件的部分事件。相关事件的具体示例请参考`popup`组件章节。
443
-
444
- | 事件名 | 说明 | 回调参数 |
445
- | :----- | :--------------: | :-------------------------- |
446
- | close | 关闭弹出层时触发 | `value`: 当前弹出层是否展开 |
447
-
448
- #### Picker Slots
449
-
450
- | 名称 | 说明 |
451
- | :------------ | :----------------: |
452
- | default | 自定义顶部栏内容 |
453
- | title | 自定义标题内容 |
454
- | confirm | 自定义确认按钮内容 |
455
- | cancel | 自定义取消按钮内容 |
456
- | columnsTop | 自定义选项上方内容 |
457
- | columnsBottom | 自定义选项下方内容 |
458
-
459
- #### Picker Column 数据结构
460
-
461
- 当传入多列数据时,`columns`为一个对象数组,数组中的每一个对象配置每一列,每一列有以下`key`
462
-
463
- | 键名 | 说明 | 类型 |
464
- | :----------- | :--------------------------: | :------- |
465
- | values | 列中对应的备选值 | string[] |
466
- | defaultIndex | 初始选中项的索引,默认为 `0` | number |
467
- | className | 为对应列添加额外的类名 | any |
468
- | children | 级联选项 | Column |
469
-
470
- #### Picker 方法
471
-
472
- 通过 `ref` 可以获取到 `Picker` 实例并调用实例方法,详见组件实例方法
473
-
474
- | 方法名 | 说明 | 参数 | 返回值 |
475
- | :-------------- | :------------------------: | :----------------------- | :---------- |
476
- | getValues | 获取所有列选中的值 | - | values |
477
- | setValues | 设置所有列选中的值 | values | - |
478
- | getIndexes | 获取所有列选中值对应的索引 | - | indexes |
479
- | setIndexes | 设置所有列选中值对应的索引 | indexes | - |
480
- | getColumnValue | 获取对应列选中的值 | columnIndex | value |
481
- | setColumnValue | 设置对应列选中的值 | columnIndex, value | - |
482
- | getColumnIndex | 获取对应列选中项的索引 | columnIndex | optionIndex |
483
- | setColumnIndex | 设置对应列选中项的索引 | columnIndex, optionIndex | - |
484
- | getColumnValues | 获取对应列中所有选项 | columnIndex | values |
485
- | setColumnValues | 设置对应列中所有选项 | columnIndex, values | - |
486
- | confirm | 停止惯性滚动并触发 | confirm 事件 | - |
487
- | cancel | 停止惯性滚动并触发 | cancel 事件 | - |
488
-
489
- ::: ifdef M83
490
- <iframe
491
- src="//app.epoint.com.cn/m8mpdoc/showcase/index.html#/modules/m8showcase/examples/em-picker"
492
- frameborder=0
493
- allowfullscreen class="ui-showcase-iframe">
494
- </iframe>
495
- ::: endif
496
- ::: ifdef M84
497
- <iframe
498
- src="//app.epoint.com.cn/m8mpdoc/showcase/m8.4/index.html#/modules/m8showcase/examples/em-picker"
499
- frameborder=0
500
- allowfullscreen class="ui-showcase-iframe">
501
- </iframe>
502
- ::: endif
503
-
504
- <style>
505
- iframe {
506
- position: fixed;
507
- right: 3.5vw;
508
- top: 17%;
509
- width: 375px;
510
- height: 75vh;
511
- box-shadow: 0 0 12px 6px #eee;
512
- border-radius: 15px;
513
- }
514
-
515
- .main .markdown-body {
516
- padding: 45px;
517
- width: calc(97vw - 661px);
518
- }
519
- </style>
@@ -1,152 +0,0 @@
1
- # 组件使用
2
-
3
- ## popup 弹出层
4
-
5
- ### 介绍
6
-
7
- - 弹出层容器,用于展示弹窗、信息提示等内容,支持多个弹出层叠加展示。
8
-
9
- ::: ifdef M83
10
-
11
- - `v8.3.11`开始支持 weex 端使用
12
-
13
- ::: endif
14
-
15
- ### 代码演示
16
-
17
- #### 基础用法
18
-
19
- 通过`v-model`控制弹出层是否展示。
20
-
21
- ```html
22
- <em-cell is-link @click="showPopup">展示弹出层</em-cell>
23
- <em-popup v-model="show">内容</em-popup>
24
- ```
25
-
26
- ::: ifdef M83
27
-
28
- ```js
29
- export default {
30
- data() {
31
- return {
32
- show: false
33
- };
34
- },
35
-
36
- methods: {
37
- showPopup() {
38
- this.show = true;
39
- }
40
- }
41
- };
42
- ```
43
-
44
- ::: endif
45
- ::: ifdef M84
46
-
47
- ```js
48
- import { ref } from 'vue';
49
- const show = ref(false);
50
-
51
- const showPopup = () => {
52
- show.value = true;
53
- };
54
- ```
55
-
56
- ::: endif
57
-
58
- #### 弹出位置
59
-
60
- 通过`position`属性设置弹出位置,默认居中弹出,可以设置为`top`、`bottom`、`left`、`right`。
61
-
62
- ```html
63
- <em-popup v-model="show" position="top" custom-style="height: 30%;" />
64
- ```
65
-
66
- #### 关闭图标
67
-
68
- 设置`closeable`属性后,会在弹出层的右上角显示关闭图标,并且可以通过`close-icon`属性自定义图标,使用`close-icon-position`属性可以自定义图标位置。
69
-
70
- ```html
71
- <em-popup v-model="show" closeable position="bottom" custom-style="height: 30%;" />
72
- <!-- 自定义图标 -->
73
- <em-popup v-model="show" closeable close-icon="close" position="bottom" custom-style="height: 30%;" />
74
- <!-- 图标位置 -->
75
- <em-popup v-model="show" closeable close-icon-position="top-left" position="bottom" custom-style="height: 30%;" />
76
- ```
77
-
78
- #### 圆角弹窗
79
-
80
- 设置`round`属性后,弹窗会根据弹出位置添加不同的圆角样式
81
-
82
- ```html
83
- <em-popup v-model="show" round position="bottom" custom-style="height: 30%;" />
84
- ```
85
-
86
- ### API
87
-
88
- #### Props
89
-
90
- | 参数 | 说明 | 类型 | 默认值 | ::: ifdef M83 weex 端支持 ::: endif |
91
- | :--------------------------------------------------------------------------- | :----------------------------------------------------------------------: | :-------------- | :---------- | :--------------------------------------------------- |
92
- | v-model ::: ifdef M83 (value) ::: endif ::: ifdef M84 (modelValue) ::: endif | 是否显示弹出层 | boolean | `false` | 是 |
93
- | overlay | 是否显示遮罩层 | boolean | `true` | 是 |
94
- | position | 弹出位置,可选值为 `top` `bottom` `right` `left` | string | `center` | 是 |
95
- | custom-style | 自定义弹出层样式 | string | - | 是 |
96
- | overlay-style | 自定义遮罩层样式 | string | - | 是 |
97
- | duration | 动画时长,单位毫秒 | number / string | `300` | 是 |
98
- | round | 是否显示圆角 | boolean | `false` | 是 |
99
- | lock-scroll | 是否锁定背景滚动 | boolean | `true` | 否 ::: ifdef M83 (weex 端默认背景不能滚动) ::: endif |
100
- | close-on-click-overlay | 是否在点击遮罩层后关闭 | boolean | `true` | 是 |
101
- | closeable | 是否显示关闭图标 | boolean | `false` | 是 |
102
- | close-icon | 关闭图标名称或图片链接 | string | `cross` | 是 |
103
- | close-icon-position | 关闭图标位置,可选值为`top-left` `bottom-left` `bottom-right` | string | `top-right` | 是 |
104
- | transition | 动画类名,等价于 `transtion` 的`name`属性, 仅在`position='center'`时有效 | string | - | 是 |
105
- | safe-area-inset-bottom | 是否开启底部安全区适配 | boolean | `false` | 否 |
106
-
107
- 注意,其中`transition`属性组件库支持的可选值有:`em-fade` `em-fade-up` `em-fade-down` `em-fade-left` `em-fade-right` `em-slide-up` `em-slide-down` `em-slide-left` `em-slide-right`
108
-
109
- #### Events
110
-
111
- | 名称 | 说明 | 回调参数 |
112
- | :--------------- | :----------------: | :----------: |
113
- | click | 点击弹出层时触发 | event: Event |
114
- | before-enter | 进入前触发 | - |
115
- | enter | 进入中触发 | - |
116
- | after-enter | 进入后触发 | - |
117
- | before-leave | 离开前触发 | - |
118
- | leave | 离开中触发 | - |
119
- | after-leave | 离开后触发 | - |
120
- | click-overlay | 点击遮罩层时触发 | - |
121
- | click-close-icon | 点击关闭图标时触发 | event: Event |
122
-
123
- ::: ifdef M83
124
- <iframe
125
- src="//app.epoint.com.cn/m8mpdoc/showcase/index.html#/modules/m8showcase/examples/em-popup"
126
- frameborder=0
127
- allowfullscreen class="ui-showcase-iframe">
128
- </iframe>
129
- ::: endif
130
- ::: ifdef M84
131
- <iframe
132
- src="//app.epoint.com.cn/m8mpdoc/showcase/m8.4/index.html#/modules/m8showcase/examples/em-popup"
133
- frameborder=0
134
- allowfullscreen class="ui-showcase-iframe">
135
- </iframe>
136
- ::: endif
137
-
138
- <style>
139
- .ui-showcase-iframe {
140
- position: fixed;
141
- right: 3.5vw;
142
- top: 17%;
143
- width: 375px;
144
- height: 75vh;
145
- box-shadow: 0 0 12px 6px #eee;
146
- border-radius: 15px;
147
- }
148
- .main .markdown-body {
149
- padding: 45px;
150
- width: calc(97vw - 661px);
151
- }
152
- </style>