Skip to content

Latest commit

 

History

History
77 lines (72 loc) · 9.19 KB

README.md

File metadata and controls

77 lines (72 loc) · 9.19 KB
Raw

tdesign-miniprogram-demo-snippets

TDesign 微信小程序组件库的组件示例代码片段

一、组件示例代码片段应有能力/内容

  1. 预览效果需要和官网示例保持一致
  2. 支持深色模式切换
  3. 移除 Skyline 相关内容

二、组件代码片段链接表

组件 描述 链接
Button TDesign 微信小程序组件库之 Button 组件示例页 https://developers.weixin.qq.com/s/F1cSo7mm75SS
Divider TDesign 微信小程序组件库之 Divider 组件示例页 https://developers.weixin.qq.com/s/tfHzFbma7IS4
Fab TDesign 微信小程序组件库之 Fab 组件示例页 https://developers.weixin.qq.com/s/KNHt9bmB7OSc
Icon TDesign 微信小程序组件库之 Icon 组件示例页 https://developers.weixin.qq.com/s/wMINibmJ7WSQ
Layout TDesign 微信小程序组件库之 Layout 组件示例页 https://developers.weixin.qq.com/s/WwISnbmq7RSC
Link TDesign 微信小程序组件库之 Link 组件示例页 https://developers.weixin.qq.com/s/AtJrPbmK7mSK
BackTop TDesign 微信小程序组件库之 BackTop 组件示例页 https://developers.weixin.qq.com/s/2aR1demj7aS2
Drawer TDesign 微信小程序组件库之 Drawer 组件示例页 https://developers.weixin.qq.com/s/WoE0Rdmj7GSE
Indexes TDesign 微信小程序组件库之 Indexes 组件示例页 https://developers.weixin.qq.com/s/BH9tQimJ7mSj
Navbar TDesign 微信小程序组件库之 Navbar 组件示例页 https://developers.weixin.qq.com/s/REHT3emm7kS5
SideBar TDesign 微信小程序组件库之 SideBar 组件示例页 https://developers.weixin.qq.com/s/fL9gNim87GSp
Steps TDesign 微信小程序组件库之 Steps 组件示例页 https://developers.weixin.qq.com/s/3H9EuimQ7JS0
TabBar TDesign 微信小程序组件库之 TabBar 组件示例页 https://developers.weixin.qq.com/s/H0G5SdmU7HSh
Tabs TDesign 微信小程序组件库之 Tabs 组件示例页 https://developers.weixin.qq.com/s/YR98fimt7MSV
Calendar TDesign 微信小程序组件库之 Calendar 组件示例页 https://developers.weixin.qq.com/s/jb5E2imk7QSV
Cascader TDesign 微信小程序组件库之 Cascader 组件示例页 https://developers.weixin.qq.com/s/i75I6imI7TSh
Checkbox TDesign 微信小程序组件库之 Checkbox 组件示例页 https://developers.weixin.qq.com/s/2M5mxim27YSp
DateTimePicker TDesign 微信小程序组件库之 DateTimePicker 组件示例页 https://developers.weixin.qq.com/s/Am6VDimq73SP
Input TDesign 微信小程序组件库之 Input 组件示例页 https://developers.weixin.qq.com/s/Id60eimj76Ss
Picker TDesign 微信小程序组件库之 Picker 组件示例页 https://developers.weixin.qq.com/s/dCCmkymv7aTw
Radio TDesign 微信小程序组件库之 Radio 组件示例页 https://developers.weixin.qq.com/s/GW6DrimI7hSV
Rate TDesign 微信小程序组件库之 Rate 组件示例页 https://developers.weixin.qq.com/s/J86K2imu7tSh
Search TDesign 微信小程序组件库之 Search 组件示例页 https://developers.weixin.qq.com/s/wG6pximT7xSH
Slider TDesign 微信小程序组件库之 Slider 组件示例页 https://developers.weixin.qq.com/s/2p6gkime7CSn
Stepper TDesign 微信小程序组件库之 Stepper 组件示例页 https://developers.weixin.qq.com/s/Ot604imU7ESt
Switch TDesign 微信小程序组件库之 Switch 组件示例页 https://developers.weixin.qq.com/s/ea6Lpim37ISs
Textarea TDesign 微信小程序组件库之 Textarea 组件示例页 https://developers.weixin.qq.com/s/uw6f3imu7KSJ
TreeSelect TDesign 微信小程序组件库之 TreeSelect 组件示例页 https://developers.weixin.qq.com/s/Bl64Ximr7LSl
Upload TDesign 微信小程序组件库之 Upload 组件示例页 https://developers.weixin.qq.com/s/jz6CGimj7NSG
Avatar TDesign 微信小程序组件库之 Avatar 组件示例页 https://developers.weixin.qq.com/s/a86Sfimw7VSO
Badge TDesign 微信小程序组件库之 Badge 组件示例页 https://developers.weixin.qq.com/s/TgaeQimG73SD
Cell TDesign 微信小程序组件库之 Cell 组件示例页 https://developers.weixin.qq.com/s/bz7aGimL72S2
Collapse TDesign 微信小程序组件库之 Collapse 组件示例页 https://developers.weixin.qq.com/s/P67sAimx75Sy
CountDown TDesign 微信小程序组件库之 CountDown 组件示例页 https://developers.weixin.qq.com/s/C37tsims79Sk
Empty TDesign 微信小程序组件库之 Empty 组件示例页 https://developers.weixin.qq.com/s/yM7PIimR7eSL
Footer TDesign 微信小程序组件库之 Footer 组件示例页 https://developers.weixin.qq.com/s/1A79mimT7gS4
Grid TDesign 微信小程序组件库之 Grid 组件示例页 https://developers.weixin.qq.com/s/6H70dimL7jSK
Image TDesign 微信小程序组件库之 Image 组件示例页 https://developers.weixin.qq.com/s/wP7zUima7kSF
ImageViewer TDesign 微信小程序组件库之 ImageViewer 组件示例页 https://developers.weixin.qq.com/s/9k7luimk7nSy
Progress TDesign 微信小程序组件库之 Progress 组件示例页 https://developers.weixin.qq.com/s/qua7YimQ7tSx
Result TDesign 微信小程序组件库之 Result 组件示例页 https://developers.weixin.qq.com/s/lw77kim37uSg
Skeleton TDesign 微信小程序组件库之 Skeleton 组件示例页 https://developers.weixin.qq.com/s/CY7gyimz7GS8
Sticky TDesign 微信小程序组件库之 Sticky 组件示例页 https://developers.weixin.qq.com/s/mJ7HTiml7NSM
Swiper TDesign 微信小程序组件库之 Swiper 组件示例页 https://developers.weixin.qq.com/s/nx7fJiml7QSM
Tag TDesign 微信小程序组件库之 Tag 组件示例页 https://developers.weixin.qq.com/s/NTaYTim77JSf
ActionSheet TDesign 微信小程序组件库之 ActionSheet 组件示例页 https://developers.weixin.qq.com/s/EM7cxim37USn
Dialog TDesign 微信小程序组件库之 Dialog 组件示例页 https://developers.weixin.qq.com/s/Pc8Xtims73Sk
DropdownMenu TDesign 微信小程序组件库之 DropdownMenu 组件示例页 https://developers.weixin.qq.com/s/T58agimj75SB
Loading TDesign 微信小程序组件库之 Loading 组件示例页 https://developers.weixin.qq.com/s/Jraocimc7mSr
Message TDesign 微信小程序组件库之 Message 组件示例页 https://developers.weixin.qq.com/s/Sr8qhimx7bSW
NoticeBar TDesign 微信小程序组件库之 NoticeBar 组件示例页 https://developers.weixin.qq.com/s/ul8DximQ79SB
Overlay TDesign 微信小程序组件库之 Overlay 组件示例页 https://developers.weixin.qq.com/s/nS8fQimZ7cSG
Popup TDesign 微信小程序组件库之 Popup 组件示例页 https://developers.weixin.qq.com/s/AB8Cvim37eS6
PullDownRefresh TDesign 微信小程序组件库之 PullDownRefresh 组件示例页 https://developers.weixin.qq.com/s/HH8v1imF7iSf
SwipeCell TDesign 微信小程序组件库之 SwipeCell 组件示例页 https://developers.weixin.qq.com/s/eK8Acim67mSD
Toast TDesign 微信小程序组件库之 Toast 组件示例页 https://developers.weixin.qq.com/s/l0azMimf7CSu

三、如何生成组件代码片段链接

  • 步骤一：通过脚本生成代码片段内容，node generate-demo-snippets.js -- --COMPONENT_NAME action-sheet，执行脚本后会生成_snippets/tdesign-action-sheet-demo 文件
  • 步骤二：将生成的代码导入开发者工具，打开开发者工具 -> 代码片段 -> + -> 导入文件地址 -> 分享 -> 获取分享链接
企业微信截图_03c81f01-2b02-41ab-9155-fc1630a4137b 企业微信截图_e586a274-cb6c-4bce-b504-5e13a8f41ff2
  • 步骤三：更新官网组件示例页"在开发者工具中预览效果"标签的链接
截屏2024-06-24 17 07 20