Skip to content

U
unidocs-zh

it&s me / unidocs-zh
与 Fork 源项目一致

Fork自 DCloud / unidocs-zh

通知 1
Star 1
Fork 0
U
unidocs-zh

前往新版Gitcode，体验更适合开发者的 AI 搜索 >>

提交 416af5b0 编写于 作者: M mehaotian
浏览文件
操作

update uni-ui slot

上级 fcf8305d
隐藏空白更改
内联 并排
Showing with 33 addition and 23 deletion
docs/component/uniui/uni-card.md
浏览文件 @ 416af5b0
...@@ -58,22 +58,23 @@ ...@@ -58,22 +58,23 @@
```html ```html
<uni-card cover="https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/460d46d0-4fcc-11eb-8ff1-d5dcf8779628.png"> <uni-card cover="https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/460d46d0-4fcc-11eb-8ff1-d5dcf8779628.png">
<!-- <image slot='cover' style="width: 100%;" :src="cover"></image> -->
<text>这是一个带封面和操作栏的卡片示例，此示例展示了封面插槽和操作栏插槽的用法。</text> <text>这是一个带封面和操作栏的卡片示例，此示例展示了封面插槽和操作栏插槽的用法。</text>
<view slot="actions" class="card-actions"> <template v-slot:actions>
<view class="card-actions-item" @click="actionsClick('分享')"> <view class="card-actions">
<uni-icons type="pengyouquan" size="18" color="#999"></uni-icons> <view class="card-actions-item" @click="actionsClick('分享')">
<text class="card-actions-item-text">分享</text> <uni-icons type="pengyouquan" size="18" color="#999"></uni-icons>
<text class="card-actions-item-text">分享</text>
</view>
<view class="card-actions-item" @click="actionsClick('点赞')">
<uni-icons type="heart" size="18" color="#999"></uni-icons>
<text class="card-actions-item-text">点赞</text>
</view>
<view class="card-actions-item" @click="actionsClick('评论')">
<uni-icons type="chatbubble" size="18" color="#999"></uni-icons>
<text class="card-actions-item-text">评论</text>
</view>
</view> </view>
<view class="card-actions-item" @click="actionsClick('点赞')"> </template>
<uni-icons type="heart" size="18" color="#999"></uni-icons>
<text class="card-actions-item-text">点赞</text>
</view>
<view class="card-actions-item" @click="actionsClick('评论')">
<uni-icons type="chatbubble" size="18" color="#999"></uni-icons>
<text class="card-actions-item-text">评论</text>
</view>
</view>
</uni-card> </uni-card>
``` ```
......
docs/component/uniui/uni-list.md
浏览文件 @ 416af5b0
...@@ -256,17 +256,21 @@ switchTab|同 uni.switchTab() ...@@ -256,17 +256,21 @@ switchTab|同 uni.switchTab()
```html ```html
<uni-list> <uni-list>
<uni-list-item title="自定义右侧插槽" note="列表描述信息" link> <uni-list-item title="自定义右侧插槽" note="列表描述信息" link>
<template slot="header"> <template v-slot:header>
<image class="slot-image" src="/static/logo.png" mode="widthFix"></image> <image class="slot-image" src="/static/logo.png" mode="widthFix"></image>
</template> </template>
</uni-list-item> </uni-list-item>
<uni-list-item> <uni-list-item>
<!-- 自定义 header --> <!-- 自定义 header -->
<view slot="header" class="slot-box"><image class="slot-image" src="/static/logo.png" mode="widthFix"></image></view> <template v-slot:header>
<view class="slot-box"><image class="slot-image" src="/static/logo.png" mode="widthFix"></image></view>
</template>
<!-- 自定义 body --> <!-- 自定义 body -->
<text slot="body" class="slot-box slot-text">自定义插槽</text> <template v-slot:body>
<text class="slot-box slot-text">自定义插槽</text>
</template>
<!-- 自定义 footer--> <!-- 自定义 footer-->
<template slot="footer"> <template v-slot:footer>
<image class="slot-image" src="/static/logo.png" mode="widthFix"></image> <image class="slot-image" src="/static/logo.png" mode="widthFix"></image>
</template> </template>
</uni-list-item> </uni-list-item>
......
docs/component/uniui/uni-nav-bar.md
浏览文件 @ 416af5b0
...@@ -119,8 +119,8 @@ Tips: ...@@ -119,8 +119,8 @@ Tips:
### NavBar Slots ### NavBar Slots
支持向 NavBar 里插入不同内容，以达到自定义的目的。 支持向 NavBar 里插入不同内容，以达到自定义的目的。
|slot名 |说明| |slot名 |说明|
|:-:|:-:| |:-:|:-:|
|default|向导航栏中间插入 | |default|向导航栏中间插入 |
...@@ -130,8 +130,8 @@ Tips: ...@@ -130,8 +130,8 @@ Tips:
```html ```html
<uni-nav-bar> <uni-nav-bar>
<view>标题栏</view> <view>标题栏</view>
<view slot="left">left</view> <view v-slot:left>left</view>
<view slot="right">right</view> <view v-slot:right>right</view>
</uni-nav-bar> </uni-nav-bar>
``` ```
......
docs/component/uniui/uni-search-bar.md
浏览文件 @ 416af5b0
...@@ -60,12 +60,17 @@ ...@@ -60,12 +60,17 @@
```html ```html
<!-- 替换组件的搜索图标 --> <!-- 替换组件的搜索图标 -->
<uni-search-bar placeholder="自定义searchIcon" @confirm="search" @cancel="cancel" cancel-text="cancel"> <uni-search-bar placeholder="自定义searchIcon" @confirm="search" @cancel="cancel" cancel-text="cancel">
<uni-icons slot="searchIcon" color="#999999" size="18" type="home" /> <template v-slot:searchIcon>
<uni-icons color="#999999" size="18" type="home" />
</template>
</uni-search-bar> </uni-search-bar>
<!-- 替换组件的清除图标 --> <!-- 替换组件的清除图标 -->
<uni-search-bar placeholder="自定义clearIcon" @confirm="search" @cancel="cancel" cancel-text="cancel"> <uni-search-bar placeholder="自定义clearIcon" @confirm="search" @cancel="cancel" cancel-text="cancel">
<view slot="clearIcon" style="color: #999999" >X</view>
<template v-slot:clearIcon>
<view style="color: #999999" >X</view>
</template>
</uni-search-bar> </uni-search-bar>
``` ```
......
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或