Skip to content

Commit

Permalink
chore(docs): add code snippets (#2939)
Browse files Browse the repository at this point in the history
  • Loading branch information
anlyyao authored Jul 1, 2024
1 parent c2cbc52 commit dfdcc5e
Show file tree
Hide file tree
Showing 46 changed files with 285 additions and 3 deletions.
6 changes: 6 additions & 0 deletions src/action-sheet/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -26,6 +26,12 @@ isComponent: true

## 代码演示

<a href="https://developers.weixin.qq.com/s/EM7cxim37USn" title="在开发者工具中预览效果" target="_blank" rel="noopener noreferrer"> 在开发者工具中预览效果 </a>

<blockquote style="background-color: #d9e1ff; font-size: 15px; line-height: 26px;margin: 16px 0 0;padding: 16px; border-radius: 6px; color: #0052d9" >
<p>Tips: 请确保开发者工具为打开状态。导入开发者工具后,依次执行:npm i > 构建npm包 > 勾选 "将JS编译成ES5"</p>
</blockquote>

### 组件类型

列表型动作面板
Expand Down
6 changes: 6 additions & 0 deletions src/avatar/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,12 @@ isComponent: true

## 代码演示

<a href="https://developers.weixin.qq.com/s/a86Sfimw7VSO" title="在开发者工具中预览效果" target="_blank" rel="noopener noreferrer"> 在开发者工具中预览效果 </a>

<blockquote style="background-color: #d9e1ff; font-size: 15px; line-height: 26px;margin: 16px 0 0;padding: 16px; border-radius: 6px; color: #0052d9" >
<p>Tips: 请确保开发者工具为打开状态。导入开发者工具后,依次执行:npm i > 构建npm包 > 勾选 "将JS编译成ES5"</p>
</blockquote>

### 头像类型

图片头像
Expand Down
6 changes: 6 additions & 0 deletions src/badge/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,12 @@ isComponent: true

## 代码演示

<a href="https://developers.weixin.qq.com/s/TgaeQimG73SD" title="在开发者工具中预览效果" target="_blank" rel="noopener noreferrer"> 在开发者工具中预览效果 </a>

<blockquote style="background-color: #d9e1ff; font-size: 15px; line-height: 26px;margin: 16px 0 0;padding: 16px; border-radius: 6px; color: #0052d9" >
<p>Tips: 请确保开发者工具为打开状态。导入开发者工具后,依次执行:npm i > 构建npm包 > 勾选 "将JS编译成ES5"</p>
</blockquote>

### 组件类型

{{ base }}
Expand Down
6 changes: 6 additions & 0 deletions src/calendar/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -25,6 +25,12 @@ isComponent: true

## 代码演示

<a href="https://developers.weixin.qq.com/s/jb5E2imk7QSV" title="在开发者工具中预览效果" target="_blank" rel="noopener noreferrer"> 在开发者工具中预览效果 </a>

<blockquote style="background-color: #d9e1ff; font-size: 15px; line-height: 26px;margin: 16px 0 0;padding: 16px; border-radius: 6px; color: #0052d9" >
<p>Tips: 请确保开发者工具为打开状态。导入开发者工具后,依次执行:npm i > 构建npm包 > 勾选 "将JS编译成ES5"</p>
</blockquote>

### 组件类型
#### 单个选择日期

Expand Down
6 changes: 6 additions & 0 deletions src/cascader/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,12 @@ isComponent: true

## 代码演示

<a href="https://developers.weixin.qq.com/s/i75I6imI7TSh" title="在开发者工具中预览效果" target="_blank" rel="noopener noreferrer"> 在开发者工具中预览效果 </a>

<blockquote style="background-color: #d9e1ff; font-size: 15px; line-height: 26px;margin: 16px 0 0;padding: 16px; border-radius: 6px; color: #0052d9" >
<p>Tips: 请确保开发者工具为打开状态。导入开发者工具后,依次执行:npm i > 构建npm包 > 勾选 "将JS编译成ES5"</p>
</blockquote>

### 基础用法

{{ base }}
Expand Down
6 changes: 6 additions & 0 deletions src/cell/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,12 @@ isComponent: true

## 代码演示

<a href="https://developers.weixin.qq.com/s/bz7aGimL72S2" title="在开发者工具中预览效果" target="_blank" rel="noopener noreferrer"> 在开发者工具中预览效果 </a>

<blockquote style="background-color: #d9e1ff; font-size: 15px; line-height: 26px;margin: 16px 0 0;padding: 16px; border-radius: 6px; color: #0052d9" >
<p>Tips: 请确保开发者工具为打开状态。导入开发者工具后,依次执行:npm i > 构建npm包 > 勾选 "将JS编译成ES5"</p>
</blockquote>

### 类型

单行单元格
Expand Down
6 changes: 6 additions & 0 deletions src/checkbox/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,12 @@ isComponent: true

## 代码演示

<a href="https://developers.weixin.qq.com/s/2M5mxim27YSp" title="在开发者工具中预览效果" target="_blank" rel="noopener noreferrer"> 在开发者工具中预览效果 </a>

<blockquote style="background-color: #d9e1ff; font-size: 15px; line-height: 26px;margin: 16px 0 0;padding: 16px; border-radius: 6px; color: #0052d9" >
<p>Tips: 请确保开发者工具为打开状态。导入开发者工具后,依次执行:npm i > 构建npm包 > 勾选 "将JS编译成ES5"</p>
</blockquote>

### 组件类型

纵向多选框
Expand Down
6 changes: 6 additions & 0 deletions src/collapse/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -27,6 +27,12 @@ isComponent: true

## 代码演示

<a href="https://developers.weixin.qq.com/s/P67sAimx75Sy" title="在开发者工具中预览效果" target="_blank" rel="noopener noreferrer"> 在开发者工具中预览效果 </a>

<blockquote style="background-color: #d9e1ff; font-size: 15px; line-height: 26px;margin: 16px 0 0;padding: 16px; border-radius: 6px; color: #0052d9" >
<p>Tips: 请确保开发者工具为打开状态。导入开发者工具后,依次执行:npm i > 构建npm包 > 勾选 "将JS编译成ES5"</p>
</blockquote>

### 类型

基础折叠面板
Expand Down
6 changes: 6 additions & 0 deletions src/count-down/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -22,6 +22,12 @@ isComponent: true

## 代码演示

<a href="https://developers.weixin.qq.com/s/C37tsims79Sk" title="在开发者工具中预览效果" target="_blank" rel="noopener noreferrer"> 在开发者工具中预览效果 </a>

<blockquote style="background-color: #d9e1ff; font-size: 15px; line-height: 26px;margin: 16px 0 0;padding: 16px; border-radius: 6px; color: #0052d9" >
<p>Tips: 请确保开发者工具为打开状态。导入开发者工具后,依次执行:npm i > 构建npm包 > 勾选 "将JS编译成ES5"</p>
</blockquote>

### 基础倒计时

{{ base }}
Expand Down
6 changes: 6 additions & 0 deletions src/date-time-picker/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,12 @@ isComponent: true

## 代码演示

<a href="https://developers.weixin.qq.com/s/Am6VDimq73SP" title="在开发者工具中预览效果" target="_blank" rel="noopener noreferrer"> 在开发者工具中预览效果 </a>

<blockquote style="background-color: #d9e1ff; font-size: 15px; line-height: 26px;margin: 16px 0 0;padding: 16px; border-radius: 6px; color: #0052d9" >
<p>Tips: 请确保开发者工具为打开状态。导入开发者工具后,依次执行:npm i > 构建npm包 > 勾选 "将JS编译成ES5"</p>
</blockquote>

### 组件类型

#### 年月日选择器
Expand Down
9 changes: 8 additions & 1 deletion src/dialog/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -18,9 +18,16 @@ isComponent: true

## 代码演示

按钮的样式,默认使用 `variant = text`,如果任意按钮改变了 `variant`,那么全部按钮都改变成这个。
<a href="https://developers.weixin.qq.com/s/Pc8Xtims73Sk" title="在开发者工具中预览效果" target="_blank" rel="noopener noreferrer"> 在开发者工具中预览效果 </a>

<blockquote style="background-color: #d9e1ff; font-size: 15px; line-height: 26px;margin: 16px 0 0;padding: 16px; border-radius: 6px; color: #0052d9" >
<p>Tips: 请确保开发者工具为打开状态。导入开发者工具后,依次执行:npm i > 构建npm包 > 勾选 "将JS编译成ES5"</p>
</blockquote>

### 组件类型

按钮的样式,默认使用 `variant = text`,如果任意按钮改变了 `variant`,那么全部按钮都改变成这个。

#### 反馈类对话框

{{ base }}
Expand Down
8 changes: 7 additions & 1 deletion src/dropdown-menu/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,13 @@ isComponent: true
}
```

## 用法
## 代码演示

<a href="https://developers.weixin.qq.com/s/T58agimj75SB" title="在开发者工具中预览效果" target="_blank" rel="noopener noreferrer"> 在开发者工具中预览效果 </a>

<blockquote style="background-color: #d9e1ff; font-size: 15px; line-height: 26px;margin: 16px 0 0;padding: 16px; border-radius: 6px; color: #0052d9" >
<p>Tips: 请确保开发者工具为打开状态。导入开发者工具后,依次执行:npm i > 构建npm包 > 勾选 "将JS编译成ES5"</p>
</blockquote>

### 单选下拉菜单

Expand Down
6 changes: 6 additions & 0 deletions src/empty/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,12 @@ isComponent: true

## 代码演示

<a href="https://developers.weixin.qq.com/s/yM7PIimR7eSL" title="在开发者工具中预览效果" target="_blank" rel="noopener noreferrer"> 在开发者工具中预览效果 </a>

<blockquote style="background-color: #d9e1ff; font-size: 15px; line-height: 26px;margin: 16px 0 0;padding: 16px; border-radius: 6px; color: #0052d9" >
<p>Tips: 请确保开发者工具为打开状态。导入开发者工具后,依次执行:npm i > 构建npm包 > 勾选 "将JS编译成ES5"</p>
</blockquote>

### 类型

图标空状态
Expand Down
7 changes: 6 additions & 1 deletion src/footer/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -18,9 +18,14 @@ isComponent: true

## 代码演示


<img src="https://tdesign.gtimg.com/miniprogram/readme/footer.png" width="375px" height="50%">

<a href="https://developers.weixin.qq.com/s/1A79mimT7gS4" title="在开发者工具中预览效果" target="_blank" rel="noopener noreferrer"> 在开发者工具中预览效果 </a>

<blockquote style="background-color: #d9e1ff; font-size: 15px; line-height: 26px;margin: 16px 0 0;padding: 16px; border-radius: 6px; color: #0052d9" >
<p>Tips: 请确保开发者工具为打开状态。导入开发者工具后,依次执行:npm i > 构建npm包 > 勾选 "将JS编译成ES5"</p>
</blockquote>

### 类型

基础页脚
Expand Down
6 changes: 6 additions & 0 deletions src/grid/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,12 @@ isComponent: true

## 代码演示

<a href="https://developers.weixin.qq.com/s/6H70dimL7jSK" title="在开发者工具中预览效果" target="_blank" rel="noopener noreferrer"> 在开发者工具中预览效果 </a>

<blockquote style="background-color: #d9e1ff; font-size: 15px; line-height: 26px;margin: 16px 0 0;padding: 16px; border-radius: 6px; color: #0052d9" >
<p>Tips: 请确保开发者工具为打开状态。导入开发者工具后,依次执行:npm i > 构建npm包 > 勾选 "将JS编译成ES5"</p>
</blockquote>

### 组件类型
基础宫格

Expand Down
6 changes: 6 additions & 0 deletions src/image-viewer/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -26,6 +26,12 @@ isComponent: true

## 代码演示

<a href="https://developers.weixin.qq.com/s/9k7luimk7nSy" title="在开发者工具中预览效果" target="_blank" rel="noopener noreferrer"> 在开发者工具中预览效果 </a>

<blockquote style="background-color: #d9e1ff; font-size: 15px; line-height: 26px;margin: 16px 0 0;padding: 16px; border-radius: 6px; color: #0052d9" >
<p>Tips: 请确保开发者工具为打开状态。导入开发者工具后,依次执行:npm i > 构建npm包 > 勾选 "将JS编译成ES5"</p>
</blockquote>

### 类型

#### 基础图片预览
Expand Down
6 changes: 6 additions & 0 deletions src/image/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,12 @@ isComponent: true

## 代码演示

<a href="https://developers.weixin.qq.com/s/wP7zUima7kSF" title="在开发者工具中预览效果" target="_blank" rel="noopener noreferrer"> 在开发者工具中预览效果 </a>

<blockquote style="background-color: #d9e1ff; font-size: 15px; line-height: 26px;margin: 16px 0 0;padding: 16px; border-radius: 6px; color: #0052d9" >
<p>Tips: 请确保开发者工具为打开状态。导入开发者工具后,依次执行:npm i > 构建npm包 > 勾选 "将JS编译成ES5"</p>
</blockquote>

### 裁切样式

{{ base }}
Expand Down
6 changes: 6 additions & 0 deletions src/indexes/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -28,6 +28,12 @@ isComponent: true

## 代码演示

<a href="https://developers.weixin.qq.com/s/BH9tQimJ7mSj" title="在开发者工具中预览效果" target="_blank" rel="noopener noreferrer"> 在开发者工具中预览效果 </a>

<blockquote style="background-color: #d9e1ff; font-size: 15px; line-height: 26px;margin: 16px 0 0;padding: 16px; border-radius: 6px; color: #0052d9" >
<p>Tips: 请确保开发者工具为打开状态。导入开发者工具后,依次执行:npm i > 构建npm包 > 勾选 "将JS编译成ES5"</p>
</blockquote>

### 基础索引


Expand Down
6 changes: 6 additions & 0 deletions src/input/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,12 @@ isComponent: true

## 代码演示

<a href="https://developers.weixin.qq.com/s/Id60eimj76Ss" title="在开发者工具中预览效果" target="_blank" rel="noopener noreferrer"> 在开发者工具中预览效果 </a>

<blockquote style="background-color: #d9e1ff; font-size: 15px; line-height: 26px;margin: 16px 0 0;padding: 16px; border-radius: 6px; color: #0052d9" >
<p>Tips: 请确保开发者工具为打开状态。导入开发者工具后,依次执行:npm i > 构建npm包 > 勾选 "将JS编译成ES5"</p>
</blockquote>

### 01 组件类型

基础输入框
Expand Down
6 changes: 6 additions & 0 deletions src/loading/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,12 @@ isComponent: true

## 代码演示

<a href="https://developers.weixin.qq.com/s/Jraocimc7mSr" title="在开发者工具中预览效果" target="_blank" rel="noopener noreferrer"> 在开发者工具中预览效果 </a>

<blockquote style="background-color: #d9e1ff; font-size: 15px; line-height: 26px;margin: 16px 0 0;padding: 16px; border-radius: 6px; color: #0052d9" >
<p>Tips: 请确保开发者工具为打开状态。导入开发者工具后,依次执行:npm i > 构建npm包 > 勾选 "将JS编译成ES5"</p>
</blockquote>

### 纯icon

{{ base }}
Expand Down
6 changes: 6 additions & 0 deletions src/message/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -26,6 +26,12 @@ import Message from 'tdesign-miniprogram/message/index';

## 代码演示

<a href="https://developers.weixin.qq.com/s/Sr8qhimx7bSW" title="在开发者工具中预览效果" target="_blank" rel="noopener noreferrer"> 在开发者工具中预览效果 </a>

<blockquote style="background-color: #d9e1ff; font-size: 15px; line-height: 26px;margin: 16px 0 0;padding: 16px; border-radius: 6px; color: #0052d9" >
<p>Tips: 请确保开发者工具为打开状态。导入开发者工具后,依次执行:npm i > 构建npm包 > 勾选 "将JS编译成ES5"</p>
</blockquote>

### 组件类型

弹窗内容为纯文本、标题和副标题、带输入框,用 API `Message.info` 方法调用反馈类对话框。
Expand Down
6 changes: 6 additions & 0 deletions src/notice-bar/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -26,6 +26,12 @@ isComponent: true

## 代码演示

<a href="https://developers.weixin.qq.com/s/ul8DximQ79SB" title="在开发者工具中预览效果" target="_blank" rel="noopener noreferrer"> 在开发者工具中预览效果 </a>

<blockquote style="background-color: #d9e1ff; font-size: 15px; line-height: 26px;margin: 16px 0 0;padding: 16px; border-radius: 6px; color: #0052d9" >
<p>Tips: 请确保开发者工具为打开状态。导入开发者工具后,依次执行:npm i > 构建npm包 > 勾选 "将JS编译成ES5"</p>
</blockquote>

### 01 组件类型

纯文字的公告栏
Expand Down
6 changes: 6 additions & 0 deletions src/overlay/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -26,6 +26,12 @@ isComponent: true

## 代码演示

<a href="https://developers.weixin.qq.com/s/nS8fQimZ7cSG" title="在开发者工具中预览效果" target="_blank" rel="noopener noreferrer"> 在开发者工具中预览效果 </a>

<blockquote style="background-color: #d9e1ff; font-size: 15px; line-height: 26px;margin: 16px 0 0;padding: 16px; border-radius: 6px; color: #0052d9" >
<p>Tips: 请确保开发者工具为打开状态。导入开发者工具后,依次执行:npm i > 构建npm包 > 勾选 "将JS编译成ES5"</p>
</blockquote>

### 基础使用

{{ base }}
Expand Down
6 changes: 6 additions & 0 deletions src/picker/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,12 @@ isComponent: true

## 代码演示

<a href="https://developers.weixin.qq.com/s/zl60wim97bSp" title="在开发者工具中预览效果" target="_blank" rel="noopener noreferrer"> 在开发者工具中预览效果 </a>

<blockquote style="background-color: #d9e1ff; font-size: 15px; line-height: 26px;margin: 16px 0 0;padding: 16px; border-radius: 6px; color: #0052d9" >
<p>Tips: 请确保开发者工具为打开状态。导入开发者工具后,依次执行:npm i > 构建npm包 > 勾选 "将JS编译成ES5"</p>
</blockquote>

### 组件类型

#### 基础选择器
Expand Down
7 changes: 7 additions & 0 deletions src/popup/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ isComponent: true
---

<span class="coverages-badge" style="margin-right: 10px"><img src="https://img.shields.io/badge/coverages%3A%20lines-100%25-blue" /></span><span class="coverages-badge" style="margin-right: 10px"><img src="https://img.shields.io/badge/coverages%3A%20functions-100%25-blue" /></span><span class="coverages-badge" style="margin-right: 10px"><img src="https://img.shields.io/badge/coverages%3A%20statements-100%25-blue" /></span><span class="coverages-badge" style="margin-right: 10px"><img src="https://img.shields.io/badge/coverages%3A%20branches-100%25-blue" /></span>

## 引入

全局引入,在 miniprogram 根目录下的`app.json`中配置,局部引入,在需要引入的页面或组件的`index.json`中配置。
Expand All @@ -18,6 +19,12 @@ isComponent: true

## 代码演示

<a href="https://developers.weixin.qq.com/s/AB8Cvim37eS6" title="在开发者工具中预览效果" target="_blank" rel="noopener noreferrer"> 在开发者工具中预览效果 </a>

<blockquote style="background-color: #d9e1ff; font-size: 15px; line-height: 26px;margin: 16px 0 0;padding: 16px; border-radius: 6px; color: #0052d9" >
<p>Tips: 请确保开发者工具为打开状态。导入开发者工具后,依次执行:npm i > 构建npm包 > 勾选 "将JS编译成ES5"</p>
</blockquote>

### 组件类型

基础弹出层
Expand Down
6 changes: 6 additions & 0 deletions src/progress/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -28,6 +28,12 @@ isComponent: true

## 代码演示

<a href="https://developers.weixin.qq.com/s/qua7YimQ7tSx" title="在开发者工具中预览效果" target="_blank" rel="noopener noreferrer"> 在开发者工具中预览效果 </a>

<blockquote style="background-color: #d9e1ff; font-size: 15px; line-height: 26px;margin: 16px 0 0;padding: 16px; border-radius: 6px; color: #0052d9" >
<p>Tips: 请确保开发者工具为打开状态。导入开发者工具后,依次执行:npm i > 构建npm包 > 勾选 "将JS编译成ES5"</p>
</blockquote>

### 01 组件类型

基础进度条
Expand Down
6 changes: 6 additions & 0 deletions src/pull-down-refresh/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,12 @@ isComponent: true

## 代码演示

<a href="https://developers.weixin.qq.com/s/HH8v1imF7iSf" title="在开发者工具中预览效果" target="_blank" rel="noopener noreferrer"> 在开发者工具中预览效果 </a>

<blockquote style="background-color: #d9e1ff; font-size: 15px; line-height: 26px;margin: 16px 0 0;padding: 16px; border-radius: 6px; color: #0052d9" >
<p>Tips: 请确保开发者工具为打开状态。导入开发者工具后,依次执行:npm i > 构建npm包 > 勾选 "将JS编译成ES5"</p>
</blockquote>

### 顶部下拉刷新

由于组件内无法监听页面滚动,需要由页面获取组件实例,并将页面滚动事件传递到组件。
Expand Down
6 changes: 6 additions & 0 deletions src/radio/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,12 @@ isComponent: true

## 代码演示

<a href="https://developers.weixin.qq.com/s/GW6DrimI7hSV" title="在开发者工具中预览效果" target="_blank" rel="noopener noreferrer"> 在开发者工具中预览效果 </a>

<blockquote style="background-color: #d9e1ff; font-size: 15px; line-height: 26px;margin: 16px 0 0;padding: 16px; border-radius: 6px; color: #0052d9" >
<p>Tips: 请确保开发者工具为打开状态。导入开发者工具后,依次执行:npm i > 构建npm包 > 勾选 "将JS编译成ES5"</p>
</blockquote>

### 纵向单选框

{{ base }}
Expand Down
6 changes: 6 additions & 0 deletions src/rate/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,12 @@ isComponent: true

## 代码演示

<a href="https://developers.weixin.qq.com/s/J86K2imu7tSh" title="在开发者工具中预览效果" target="_blank" rel="noopener noreferrer"> 在开发者工具中预览效果 </a>

<blockquote style="background-color: #d9e1ff; font-size: 15px; line-height: 26px;margin: 16px 0 0;padding: 16px; border-radius: 6px; color: #0052d9" >
<p>Tips: 请确保开发者工具为打开状态。导入开发者工具后,依次执行:npm i > 构建npm包 > 勾选 "将JS编译成ES5"</p>
</blockquote>

### 组件类型

实心评分
Expand Down
Loading

0 comments on commit dfdcc5e

Please sign in to comment.