提交 44e5b675 编写于 作者: shutao-dc's avatar shutao-dc

update list-view.uvue

上级 bac11742
<script> <script>
import { type ItemType } from '@/components/enum-data/enum-data.vue'
export default { export default {
data() { data() {
return { return {
...@@ -14,7 +15,9 @@ ...@@ -14,7 +15,9 @@
scroll_top_input: 0, scroll_top_input: 0,
scroll_left_input: 0, scroll_left_input: 0,
refresher_background_input: "#FFF", refresher_background_input: "#FFF",
scrollData: [] as Array<string> scrollData: [] as Array<string>,
size_enum: [{ "value": 0, "name": "item---0" }, { "value": 3, "name": "item---3" }] as ItemType[],
scrollIntoView: ""
} }
}, },
onLoad() { onLoad() {
...@@ -33,8 +36,8 @@ ...@@ -33,8 +36,8 @@
list_view_tap() { console.log("手指触摸后马上离开") }, list_view_tap() { console.log("手指触摸后马上离开") },
list_view_longpress() { console.log("如果一个组件被绑定了 longpress 事件,那么当用户长按这个组件时,该事件将会被触发。") }, list_view_longpress() { console.log("如果一个组件被绑定了 longpress 事件,那么当用户长按这个组件时,该事件将会被触发。") },
list_view_refresherpulling() { console.log("自定义下拉刷新控件被下拉") }, list_view_refresherpulling() { console.log("自定义下拉刷新控件被下拉") },
list_view_refresherrefresh() { list_view_refresherrefresh() {
console.log("自定义下拉刷新被触发") console.log("自定义下拉刷新被触发 ")
this.refresher_triggered_boolean = true this.refresher_triggered_boolean = true
setTimeout(function(){ setTimeout(function(){
this.refresher_triggered_boolean = false this.refresher_triggered_boolean = false
...@@ -63,7 +66,8 @@ ...@@ -63,7 +66,8 @@
confirm_lower_threshold_input(value : number) { this.lower_threshold_input = value }, confirm_lower_threshold_input(value : number) { this.lower_threshold_input = value },
confirm_scroll_top_input(value : number) { this.scroll_top_input = value }, confirm_scroll_top_input(value : number) { this.scroll_top_input = value },
confirm_scroll_left_input(value : number) { this.scroll_left_input = value }, confirm_scroll_left_input(value : number) { this.scroll_left_input = value },
confirm_refresher_background_input(value : string) { this.refresher_background_input = value } confirm_refresher_background_input(value : string) { this.refresher_background_input = value },
item_change_size_enum(index : number) { this.scrollIntoView = "item---"+index }
} }
} }
</script> </script>
...@@ -72,7 +76,7 @@ ...@@ -72,7 +76,7 @@
<view class="main"> <view class="main">
<list-view :scroll-x="scroll_x_boolean" :scroll-y="scroll_y_boolean" :rebound="rebound_boolean" <list-view :scroll-x="scroll_x_boolean" :scroll-y="scroll_y_boolean" :rebound="rebound_boolean"
:upper-threshold="upper_threshold_input" :lower-threshold="lower_threshold_input" :scroll-top="scroll_top_input" :upper-threshold="upper_threshold_input" :lower-threshold="lower_threshold_input" :scroll-top="scroll_top_input"
:scroll-left="scroll_left_input" :show-scrollbar="show_scrollbar_boolean" :scroll-left="scroll_left_input" :show-scrollbar="show_scrollbar_boolean" :scroll-into-view="scrollIntoView"
:scroll-with-animation="scroll_with_animation_boolean" :refresher-enabled="refresher_enabled_boolean" :scroll-with-animation="scroll_with_animation_boolean" :refresher-enabled="refresher_enabled_boolean"
:refresher-background="refresher_background_input" :refresher-triggered="refresher_triggered_boolean" :refresher-background="refresher_background_input" :refresher-triggered="refresher_triggered_boolean"
@click="list_view_click" @touchstart="list_view_touchstart" @touchmove="list_view_touchmove" @click="list_view_click" @touchstart="list_view_touchstart" @touchmove="list_view_touchmove"
...@@ -82,7 +86,7 @@ ...@@ -82,7 +86,7 @@
@refresherabort="list_view_refresherabort" @scrolltoupper="list_view_scrolltoupper" @refresherabort="list_view_refresherabort" @scrolltoupper="list_view_scrolltoupper"
@scrolltolower="list_view_scrolltolower" @scroll="list_view_scroll" style="width:100%;"> @scrolltolower="list_view_scrolltolower" @scroll="list_view_scroll" style="width:100%;">
<list-item <list-item
v-for="key in scrollData" :key="key" @click="list_item_click" @touchstart="list_item_touchstart" v-for="key in scrollData" :key="key" :id="key" @click="list_item_click" @touchstart="list_item_touchstart"
@touchmove="list_item_touchmove" @touchcancel="list_item_touchcancel" @touchend="list_item_touchend" @touchmove="list_item_touchmove" @touchcancel="list_item_touchcancel" @touchend="list_item_touchend"
@tap="list_item_tap" @longpress="list_item_longpress" @tap="list_item_tap" @longpress="list_item_longpress"
class="list-item"> class="list-item">
...@@ -112,6 +116,7 @@ ...@@ -112,6 +116,7 @@
<input-data defaultValue="0" title="设置横向滚动条位置" type="number" @confirm="confirm_scroll_left_input"></input-data> <input-data defaultValue="0" title="设置横向滚动条位置" type="number" @confirm="confirm_scroll_left_input"></input-data>
<input-data defaultValue="#FFF" title="设置自定义下拉刷新区域背景颜色" type="text" <input-data defaultValue="#FFF" title="设置自定义下拉刷新区域背景颜色" type="text"
@confirm="confirm_refresher_background_input"></input-data> @confirm="confirm_refresher_background_input"></input-data>
<enum-data :items="size_enum" title="通过id位置跳转" @change="item_change_size_enum"></enum-data>
</view> </view>
<!-- #ifdef APP --> <!-- #ifdef APP -->
</scroll-view> </scroll-view>
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册