Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/uni-helper/uni-ui-snippets-vscode

uni-ui 的 VSCode 代码片段
https://github.com/uni-helper/uni-ui-snippets-vscode

Last synced: 2 days ago
JSON representation

uni-ui 的 VSCode 代码片段

Awesome Lists containing this project

README

        

# @uni-helper/uni-ui-snippets-vscode

[![License](https://img.shields.io/github/license/uni-helper/uni-ui-snippets-vscode?label=License&color=brightgreen)](https://github.com/uni-helper/uni-ui-snippets-vscode/blob/main/LICENSE)

[![Visual Studio Marketplace Version](https://img.shields.io/visual-studio-marketplace/v/uni-helper.uni-ui-snippets-vscode?label=VS%20Marketplace&color=brightgreen)](https://marketplace.visualstudio.com/items?itemName=uni-helper.uni-ui-snippets-vscode)

[![Open VSX Version](https://img.shields.io/open-vsx/v/uni-helper/uni-ui-snippets-vscode?label=Open%20VSX&color=brightgreen)](https://open-vsx.org/extension/uni-helper/uni-ui-snippets-vscode)

[改动日志](https://github.com/uni-helper/uni-ui-snippets-vscode/blob/main/CHANGELOG.md)

想让 `uni-app` 开发变得更直观、高效?想要更好的 `uni-app` 开发体验?不妨看看 [uni-helper 主页](https://uni-helper.js.org) 和 [uni-helper GitHub Organization](https://github.com/uni-helper)!

## 插件特性

- uni-ui 基本能力代码片段
- 参考 [uni-ui 官方组件文档](https://github.com/dcloudio/uni-ui#readme)
- 参考 [Vue.js 2 风格指南](https://v2.cn.vuejs.org/v2/style-guide/) 和 [Vue.js 3 风格指南](https://cn.vuejs.org/style-guide/)

**插件和文档的冲突之处,请以文档为准。**

插件源代码在 [uni-helper/uni-ui-snippets-vscode](https://github.com/uni-helper/uni-ui-snippets-vscode)。欢迎提交 ISSUE 和 PR 改进本插件。

## 使用

安装插件后重启 VSCode 即可。

## HTML

|API|Prefix|Description|
|-|-|-|
|``|`uni-badge`, ``, `UniBadge`, ``|uni-ui 徽标/标记/数字角标/徽章,一般出现在通知图标或头像的右上角,用于显示需要处理的消息条数。更多信息查看 。|
|``|`uni-calendar`, ``, `UniCalendar`, ``|uni-ui 日历,当数据是日期或按照日期划分时使用,如日程、课表、价格日历、农历等。更多信息查看 。|
|``|`uni-card`, ``, `UniCard`, ``|uni-ui 卡片,可承载文字、列表、图片、段落,常用于概览。更多信息查看 。|
|``|`uni-collapse`, ``, `UniCollapse`, ``|uni-ui 折叠面板,对复杂区域进行分组和隐藏,保持页面的整洁。更多信息查看 。|
|``|`uni-collapse-item`, ``, `UniCollapseItem`, ``|uni-ui 折叠面板项。更多信息查看 。|
|``|`uni-combox`, ``, `UniCombox`, ``|uni-ui 组合框,一般用于可选择也可输入的表单项。更多信息查看 。|
|``|`uni-countdown`, ``, `UniCountdown`, ``|uni-ui 倒计时。更多信息查看 。|
|``|`uni-data-checkbox`, ``, `UniDataCheckbox`, ``|uni-ui 数据选择器。更多信息查看 。|
|``|`uni-data-picker`, ``, `UniDataPicker`, ``|uni-ui 级联选择器。更多信息查看 。|
|``|`uni-dateformat`, ``, `UniDateformat`, ``|uni-ui 日期格式化。请考虑使用 [dayjs](https://dayjs.gitee.io/zh-CN/)。更多信息查看 。|
|``|`uni-datetime-picker`, ``, `UniDatetimePicker`, ``|uni-ui 日期时间选择器。更多信息查看 。|
|``|`uni-drawer`, ``, `UniDrawer`, ``|uni-ui 抽屉,屏幕边缘滑出的浮层面板,用户在抽屉内操作时不必离开当前任务,操作完成后,可以平滑地回到原任务。更多信息查看 。|
|``|`uni-easyinput`, ``, `UniEasyinput`, ``|uni-ui 增强输入框。更多信息查看 。|
|``|`uni-fab`, ``, `UniFab`, ``|uni-ui 悬浮按钮。更多信息查看 。|
|``|`uni-fav`, ``, `UniFav`, ``|uni-ui 收藏按钮。更多信息查看 。|
|``|`uni-file-picker`, ``, `UniFilePicker`, ``|uni-ui 文件选择上传。更多信息查看 。|
|``|`uni-forms`, ``, `UniForms`, ``|uni-ui 表单。更多信息查看 。|
|``|`uni-forms-item`, ``, `UniFormsItem`, ``|uni-ui 表单项。更多信息查看 。|
|``|`uni-goods-nav`, ``, `UniGoodsNav`, ``|uni-ui 商品导航。更多信息查看 。|
|``|`uni-grid`, ``, `UniGrid`, ``|uni-ui 宫格。更多信息查看 。|
|``|`uni-grid-item`, ``, `UniGridItem`, ``|uni-ui 宫格项。更多信息查看 。|
|``|`uni-group`, ``, `UniGroup`, ``|uni-ui 分组。更多信息查看 。|
|``|`uni-icons`, ``, `UniIcons`, ``|uni-ui 图标。更多信息查看 。|
|``|`uni-indexed-list`, ``, `UniIndexedList`, ``|uni-ui 索引列表。更多信息查看 。|
|``|`uni-link`, ``, `UniLink`, ``|uni-ui 超链接。更多信息查看 。|
|``|`uni-list`, ``, `UniList`, ``|uni-ui 列表。更多信息查看 。|
|``|`uni-list-chat`, ``, `UniListChat`, ``|uni-ui 聊天列表项。更多信息查看 。|
|``|`uni-list-item`, ``, `UniListItem`, ``|uni-ui 列表项。更多信息查看 。|
|``|`uni-load-more`, ``, `UniLoadMore`, ``|uni-ui 加载更多。更多信息查看 。|
|``|`uni-nav-bar`, ``, `UniNavBar`, ``|uni-ui 导航栏。更多信息查看 。|
|``|`uni-notice-bar`, ``, `UniNoticeBar`, ``|uni-ui 通告栏。更多信息查看 。|
|``|`uni-number-box`, ``, `UniNumberBox`, ``|uni-ui 数字输入框。更多信息查看 。|
|``|`uni-pagination`, ``, `UniPagination`, ``|uni-ui 分页器。更多信息查看 。|
|``|`uni-popup`, ``, `UniPopup`, ``|uni-ui 弹出层。更多信息查看 。|
|``|`uni-popup-dialog`, ``, `UniPopupDialog`, ``|uni-ui 弹出层对话框。更多信息查看 。|
|``|`uni-popup-message`, ``, `UniPopupMessage`, ``|uni-ui 弹出层提示信息。更多信息查看 。|
|``|`uni-popup-share`, ``, `UniPopupShare`, ``|uni-ui 弹出层分享。更多信息查看 。|
|``|`uni-rate`, ``, `UniRate`, ``|uni-ui 评分。更多信息查看 。|
|``|`uni-row`, ``, `UniRow`, ``|uni-ui 布局行。更多信息查看 。|
|``|`uni-col`, ``, `UniCol`, ``|uni-ui 布局列。更多信息查看 。|
|``|`uni-search-bar`, ``, `UniSearchBar`, ``|uni-ui 搜索栏。更多信息查看 。|
|``|`uni-segmented-control`, ``, `UniSegmentedControl`, ``|uni-ui 分段器。更多信息查看 。|
|``|`uni-steps`, ``, `UniSteps`, ``|uni-ui 步骤条。更多信息查看 。|
|``|`uni-swipe-action`, ``, `UniSwipeAction`, ``|uni-ui 滑动操作。更多信息查看 。|
|``|`uni-swipe-action-item`, ``, `UniSwipeActionItem`, ``|uni-ui 滑动操作项。更多信息查看 。|
|``|`uni-swiper-dot`, ``, `UniSwiperDot`, ``|uni-ui 轮播图指示点。更多信息查看 。|
|``|`uni-table`, ``, `UniTable`, ``|uni-table 表格。更多信息查看 。|
|``|`uni-tr`, ``, `UniTr`, ``|uni-table 表格。更多信息查看 。|
|``|`uni-th`, ``, `UniTh`, ``|uni-table 表格。更多信息查看 。|
|``|`uni-td`, ``, `UniTd`, ``|uni-table 表格。更多信息查看 。|
|``|`uni-tag`, ``, `UniTag`, ``|uni-ui 标签。更多信息查看 。|
|``|`uni-title`, ``, `UniTitle`, ``|uni-ui 标题。更多信息查看 。|
|``|`uni-transition`, ``, `UniTransition`, ``|uni-ui 过渡动画。更多信息查看 。|