提交 17e1d144 编写于 作者: D DCloud_LXH

feat: uvue 组件示例

上级 bdd6d90f
因为 它太大了无法显示 source diff 。你可以改为 查看blob
...@@ -6,6 +6,8 @@ ...@@ -6,6 +6,8 @@
<!-- UTSCOMJSON.animation-view.event --> <!-- UTSCOMJSON.animation-view.event -->
<!-- UTSCOMJSON.animation-view.example -->
<!-- UTSCOMJSON.animation-view.compatibility --> <!-- UTSCOMJSON.animation-view.compatibility -->
<!-- UTSCOMJSON.animation-view.reference --> <!-- UTSCOMJSON.animation-view.reference -->
......
...@@ -6,6 +6,8 @@ ...@@ -6,6 +6,8 @@
<!-- UTSCOMJSON.button.event --> <!-- UTSCOMJSON.button.event -->
<!-- UTSCOMJSON.button.example -->
<!-- UTSCOMJSON.button.compatibility --> <!-- UTSCOMJSON.button.compatibility -->
<!-- UTSCOMJSON.button.reference --> <!-- UTSCOMJSON.button.reference -->
...@@ -63,3 +65,4 @@ button 组件没有 url 属性,如果要跳转页面,可以在@click中编 ...@@ -63,3 +65,4 @@ button 组件没有 url 属性,如果要跳转页面,可以在@click中编
## tips ## tips
- button 的text区域文字,app-uvue下不支持 `\n` 方式换行,会直接显示 `\n` 字符。微信小程序下 `\n` 会变成一个空格 - button 的text区域文字,app-uvue下不支持 `\n` 方式换行,会直接显示 `\n` 字符。微信小程序下 `\n` 会变成一个空格
...@@ -6,6 +6,8 @@ ...@@ -6,6 +6,8 @@
<!-- UTSCOMJSON.checkbox-group.event --> <!-- UTSCOMJSON.checkbox-group.event -->
<!-- UTSCOMJSON.checkbox-group.example -->
<!-- UTSCOMJSON.checkbox-group.compatibility --> <!-- UTSCOMJSON.checkbox-group.compatibility -->
<!-- UTSCOMJSON.checkbox-group.reference --> <!-- UTSCOMJSON.checkbox-group.reference -->
...@@ -19,6 +21,8 @@ ...@@ -19,6 +21,8 @@
<!-- UTSCOMJSON.checkbox.event --> <!-- UTSCOMJSON.checkbox.event -->
<!-- UTSCOMJSON.checkbox.example -->
<!-- UTSCOMJSON.checkbox.compatibility --> <!-- UTSCOMJSON.checkbox.compatibility -->
<!-- UTSCOMJSON.checkbox.reference --> <!-- UTSCOMJSON.checkbox.reference -->
......
...@@ -41,6 +41,8 @@ ...@@ -41,6 +41,8 @@
image组件内部使用facebook的[fresco](https://github.com/facebook/fresco)库(2.5.0),自带缓存策略,也会自动清理缓存。 image组件内部使用facebook的[fresco](https://github.com/facebook/fresco)库(2.5.0),自带缓存策略,也会自动清理缓存。
<!-- UTSCOMJSON.image.example -->
<!-- UTSCOMJSON.image.compatibility --> <!-- UTSCOMJSON.image.compatibility -->
### tips ### tips
......
...@@ -6,6 +6,8 @@ ...@@ -6,6 +6,8 @@
<!-- UTSCOMJSON.input.event --> <!-- UTSCOMJSON.input.event -->
<!-- UTSCOMJSON.input.example -->
<!-- UTSCOMJSON.input.compatibility --> <!-- UTSCOMJSON.input.compatibility -->
<!-- UTSCOMJSON.input.reference --> <!-- UTSCOMJSON.input.reference -->
......
...@@ -16,6 +16,8 @@ list-view和scroll-view都是滚动组件,list适用于长列表场景,其 ...@@ -16,6 +16,8 @@ list-view和scroll-view都是滚动组件,list适用于长列表场景,其
<!-- UTSCOMJSON.list-view.event --> <!-- UTSCOMJSON.list-view.event -->
<!-- UTSCOMJSON.list-view.example -->
<!-- UTSCOMJSON.list-view.compatibility --> <!-- UTSCOMJSON.list-view.compatibility -->
<!-- UTSCOMJSON.list-view.reference --> <!-- UTSCOMJSON.list-view.reference -->
...@@ -29,6 +31,8 @@ list-view和scroll-view都是滚动组件,list适用于长列表场景,其 ...@@ -29,6 +31,8 @@ list-view和scroll-view都是滚动组件,list适用于长列表场景,其
<!-- UTSCOMJSON.list-item.event --> <!-- UTSCOMJSON.list-item.event -->
<!-- UTSCOMJSON.list-item.example -->
<!-- UTSCOMJSON.list-item.compatibility --> <!-- UTSCOMJSON.list-item.compatibility -->
<!-- UTSCOMJSON.list-item.reference --> <!-- UTSCOMJSON.list-item.reference -->
......
...@@ -6,6 +6,8 @@ ...@@ -6,6 +6,8 @@
<!-- UTSCOMJSON.navigator.event --> <!-- UTSCOMJSON.navigator.event -->
<!-- UTSCOMJSON.navigator.example -->
<!-- UTSCOMJSON.navigator.compatibility --> <!-- UTSCOMJSON.navigator.compatibility -->
<!-- UTSCOMJSON.navigator.reference --> <!-- UTSCOMJSON.navigator.reference -->
......
...@@ -6,6 +6,8 @@ ...@@ -6,6 +6,8 @@
<!-- UTSCOMJSON.picker-view.event --> <!-- UTSCOMJSON.picker-view.event -->
<!-- UTSCOMJSON.picker-view.example -->
<!-- UTSCOMJSON.picker-view.compatibility --> <!-- UTSCOMJSON.picker-view.compatibility -->
<!-- UTSCOMJSON.picker-view.reference --> <!-- UTSCOMJSON.picker-view.reference -->
...@@ -19,9 +21,11 @@ ...@@ -19,9 +21,11 @@
<!-- UTSCOMJSON.picker-view-column.event --> <!-- UTSCOMJSON.picker-view-column.event -->
<!-- UTSCOMJSON.picker-view-column.example -->
<!-- UTSCOMJSON.picker-view-column.compatibility --> <!-- UTSCOMJSON.picker-view-column.compatibility -->
<!-- UTSCOMJSON.picker-view-column.reference --> <!-- UTSCOMJSON.picker-view-column.reference -->
## tips ## tips
- picker里如放置较长内容,应该使用list-view而不是scroll-view。 - picker里如放置较长内容,应该使用list-view而不是scroll-view。
\ No newline at end of file
...@@ -6,6 +6,8 @@ ...@@ -6,6 +6,8 @@
<!-- UTSCOMJSON.progress.event --> <!-- UTSCOMJSON.progress.event -->
<!-- UTSCOMJSON.progress.example -->
<!-- UTSCOMJSON.progress.compatibility --> <!-- UTSCOMJSON.progress.compatibility -->
<!-- UTSCOMJSON.progress.reference --> <!-- UTSCOMJSON.progress.reference -->
......
...@@ -6,6 +6,8 @@ ...@@ -6,6 +6,8 @@
<!-- UTSCOMJSON.radio-group.event --> <!-- UTSCOMJSON.radio-group.event -->
<!-- UTSCOMJSON.radio-group.example -->
<!-- UTSCOMJSON.radio-group.compatibility --> <!-- UTSCOMJSON.radio-group.compatibility -->
<!-- UTSCOMJSON.radio-group.reference --> <!-- UTSCOMJSON.radio-group.reference -->
...@@ -19,6 +21,8 @@ ...@@ -19,6 +21,8 @@
<!-- UTSCOMJSON.radio.event --> <!-- UTSCOMJSON.radio.event -->
<!-- UTSCOMJSON.radio.example -->
<!-- UTSCOMJSON.radio.compatibility --> <!-- UTSCOMJSON.radio.compatibility -->
<!-- UTSCOMJSON.radio.reference --> <!-- UTSCOMJSON.radio.reference -->
......
...@@ -26,6 +26,8 @@ ...@@ -26,6 +26,8 @@
<!-- UTSCOMJSON.rich-text.event --> <!-- UTSCOMJSON.rich-text.event -->
<!-- UTSCOMJSON.rich-text.example -->
<!-- UTSCOMJSON.rich-text.compatibility --> <!-- UTSCOMJSON.rich-text.compatibility -->
<!-- UTSCOMJSON.rich-text.reference --> <!-- UTSCOMJSON.rich-text.reference -->
...@@ -33,4 +35,4 @@ ...@@ -33,4 +35,4 @@
## bug&tips ## bug&tips
- HTML String支持常用但不是全部web样式。 - HTML String支持常用但不是全部web样式。
- HTML String类型的`<img/>`不支持自定义宽高,默认以rich-text组件宽度为基准等比缩放;节点列表类型的`<img>/`支持自定义宽高。 - HTML String类型的`<img/>`不支持自定义宽高,默认以rich-text组件宽度为基准等比缩放;节点列表类型的`<img>/`支持自定义宽高。
\ No newline at end of file
...@@ -6,32 +6,34 @@ ...@@ -6,32 +6,34 @@
<!-- UTSCOMJSON.scroll-view.event --> <!-- UTSCOMJSON.scroll-view.event -->
<!-- UTSCOMJSON.scroll-view.compatibility --> <!-- UTSCOMJSON.scroll-view.example -->
### 自定义下拉刷新样式 <!-- UTSCOMJSON.scroll-view.compatibility -->
1. 设置`refresher-default-style`属性为 none 不使用默认样式 ### 自定义下拉刷新样式
1. 设置`refresher-default-style`属性为 none 不使用默认样式
2. 自定义下拉刷新元素必须要声明为 slot="refresher" 2. 自定义下拉刷新元素必须要声明为 slot="refresher"
3. 通过组件提供的refresherpulling、refresherrefresh、refresherrestore、refresherabort下拉刷新事件调整自定义下拉刷新元素!实现预期效果 3. 通过组件提供的refresherpulling、refresherrefresh、refresherrestore、refresherabort下拉刷新事件调整自定义下拉刷新元素!实现预期效果
```uts ```uts
<scroll-view refresher-default-style="none" :refresher-enabled="true" :refresher-triggered="refresherTriggered" <scroll-view refresher-default-style="none" :refresher-enabled="true" :refresher-triggered="refresherTriggered"
@refresherpulling="onRefresherpulling" @refresherrefresh="onRefresherrefresh" @refresherpulling="onRefresherpulling" @refresherrefresh="onRefresherrefresh"
@refresherrestore="onRefresherrestore" style="flex:1" > @refresherrestore="onRefresherrestore" style="flex:1" >
<view v-for="i in 20" class="content-item"> <view v-for="i in 20" class="content-item">
<text class="text">item-{{i}}</text> <text class="text">item-{{i}}</text>
</view> </view>
<!-- 自定义下拉刷新元素 --> <!-- 自定义下拉刷新元素 -->
<view slot="refresher" class="refresh-box"> <view slot="refresher" class="refresh-box">
<text class="tip-text">{{text[state]}}</text> <text class="tip-text">{{text[state]}}</text>
</view> </view>
</scroll-view> </scroll-view>
``` ```
**具体代码请参考:**[自定义下拉刷新样式示例](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/alpha/pages/component/scroll-view/scroll-view-custom-refresher-props.uvue) **具体代码请参考:**[自定义下拉刷新样式示例](https://gitcode.net/dcloud/hello-uni-app-x/-/blob/alpha/pages/component/scroll-view/scroll-view-custom-refresher-props.uvue)
<!-- UTSCOMJSON.scroll-view.reference --> <!-- UTSCOMJSON.scroll-view.reference -->
...@@ -6,6 +6,8 @@ ...@@ -6,6 +6,8 @@
<!-- UTSCOMJSON.slider.event --> <!-- UTSCOMJSON.slider.event -->
<!-- UTSCOMJSON.slider.example -->
<!-- UTSCOMJSON.slider.compatibility --> <!-- UTSCOMJSON.slider.compatibility -->
## tips ## tips
......
...@@ -6,6 +6,8 @@ ...@@ -6,6 +6,8 @@
<!-- UTSCOMJSON.swiper.event --> <!-- UTSCOMJSON.swiper.event -->
<!-- UTSCOMJSON.swiper.example -->
<!-- UTSCOMJSON.swiper.compatibility --> <!-- UTSCOMJSON.swiper.compatibility -->
<!-- UTSCOMJSON.swiper.reference --> <!-- UTSCOMJSON.swiper.reference -->
...@@ -19,6 +21,8 @@ ...@@ -19,6 +21,8 @@
<!-- UTSCOMJSON.swiper-item.event --> <!-- UTSCOMJSON.swiper-item.event -->
<!-- UTSCOMJSON.swiper-item.example -->
<!-- UTSCOMJSON.swiper-item.compatibility --> <!-- UTSCOMJSON.swiper-item.compatibility -->
<!-- UTSCOMJSON.swiper-item.reference --> <!-- UTSCOMJSON.swiper-item.reference -->
......
...@@ -6,6 +6,8 @@ ...@@ -6,6 +6,8 @@
<!-- UTSCOMJSON.switch.event --> <!-- UTSCOMJSON.switch.event -->
<!-- UTSCOMJSON.switch.example -->
<!-- UTSCOMJSON.switch.compatibility --> <!-- UTSCOMJSON.switch.compatibility -->
<!-- UTSCOMJSON.switch.reference --> <!-- UTSCOMJSON.switch.reference -->
......
...@@ -10,6 +10,8 @@ ...@@ -10,6 +10,8 @@
<!-- UTSCOMJSON.text.event --> <!-- UTSCOMJSON.text.event -->
<!-- UTSCOMJSON.text.example -->
<!-- UTSCOMJSON.text.compatibility --> <!-- UTSCOMJSON.text.compatibility -->
## 子组件 ## 子组件
......
...@@ -6,6 +6,8 @@ ...@@ -6,6 +6,8 @@
<!-- UTSCOMJSON.textarea.event --> <!-- UTSCOMJSON.textarea.event -->
<!-- UTSCOMJSON.textarea.example -->
<!-- UTSCOMJSON.textarea.compatibility --> <!-- UTSCOMJSON.textarea.compatibility -->
<!-- UTSCOMJSON.textarea.reference --> <!-- UTSCOMJSON.textarea.reference -->
......
...@@ -6,6 +6,8 @@ ...@@ -6,6 +6,8 @@
<!-- UTSCOMJSON.video.event --> <!-- UTSCOMJSON.video.event -->
<!-- UTSCOMJSON.video.example -->
<!-- UTSCOMJSON.video.compatibility --> <!-- UTSCOMJSON.video.compatibility -->
#### App平台 #### App平台
...@@ -25,4 +27,4 @@ ijkplayer库的功能较多,video组件并非完全封装。有需要的开发 ...@@ -25,4 +27,4 @@ ijkplayer库的功能较多,video组件并非完全封装。有需要的开发
video的操作api为[uni.createVideoContext()](../api/createvideocontext.md) video的操作api为[uni.createVideoContext()](../api/createvideocontext.md)
给video组件设一个id属性,将id的值传入uni.createVideoContext(),即可得到video组件的上下文对象,进一步可使用`.play()``.stop()`等方法。 给video组件设一个id属性,将id的值传入uni.createVideoContext(),即可得到video组件的上下文对象,进一步可使用`.play()``.stop()`等方法。
\ No newline at end of file
...@@ -6,8 +6,10 @@ ...@@ -6,8 +6,10 @@
<!-- UTSCOMJSON.view.event --> <!-- UTSCOMJSON.view.event -->
<!-- UTSCOMJSON.view.example -->
<!-- UTSCOMJSON.view.compatibility --> <!-- UTSCOMJSON.view.compatibility -->
<!-- UTSCOMJSON.view.reference --> <!-- UTSCOMJSON.view.reference -->
view是Drawable的组件,也就是可以在view上调用绘制API自绘内容。它类似canvas,但不需要单独的canvas组件,在view上就可以直接draw。[详见](../dom/drawablecontext.md) view是Drawable的组件,也就是可以在view上调用绘制API自绘内容。它类似canvas,但不需要单独的canvas组件,在view上就可以直接draw。[详见](../dom/drawablecontext.md)
\ No newline at end of file
...@@ -6,6 +6,8 @@ ...@@ -6,6 +6,8 @@
<!-- UTSCOMJSON.web-view.event --> <!-- UTSCOMJSON.web-view.event -->
<!-- UTSCOMJSON.web-view.example -->
<!-- UTSCOMJSON.web-view.compatibility --> <!-- UTSCOMJSON.web-view.compatibility -->
<!-- UTSCOMJSON.web-view.reference --> <!-- UTSCOMJSON.web-view.reference -->
...@@ -14,4 +16,4 @@ ...@@ -14,4 +16,4 @@
web-view的操作api为[uni.createWebviewContext()](../api/createwebviewcontext.md) web-view的操作api为[uni.createWebviewContext()](../api/createwebviewcontext.md)
给web-view组件设一个id属性,将id的值传入uni.createWebviewContext(),即可得到web-view组件的上下文对象,进一步可使用`.evalJS()``.reload()`等方法。 给web-view组件设一个id属性,将id的值传入uni.createWebviewContext(),即可得到web-view组件的上下文对象,进一步可使用`.evalJS()``.reload()`等方法。
\ No newline at end of file
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册