< view class = "reciter-container container" >
< view class = "tab-bar" >
< view class = "tab-bar-left" >
</ view >
< view bindtap = "switchTab" data-index = "{{item.index}}" class = "{{(tab.current == item.index) ? 'tab-bar-item-current' : ''}} tab-bar-item" wx:for-items = "{{tabs}}" wx:key = "{{index}}" >
{{item.display}}
</ view >
< view class = "tab-bar-query" >
</ view >
</ view >
< view class = "reciter-content" scroll-y = "{{true}}" >
< view class = "reciter-content-main" >
< view style = "width: 100px;" wx:for-items = "{{reciterList}}" wx:key = "{{index}}" >{{item.name}}</ view >
</ view >
</ view >
</ view >
|
Page({
data: {
tabs: [{index: 0, display: '朗诵' }, {index: 1, display: '诗词' }, {index: 2, display: '比赛' }],
tab: {
current: 0
},
reciterList: [],
},
onPullDownRefresh: function () {
console.log( 'onPullDownRefresh' );
wx.showNavigationBarLoading();
setTimeout(() => {wx.stopPullDownRefresh(); console.log( 'stopPullDownRefresh' ); wx.hideNavigationBarLoading()}, 3000)
},
onReachBottom: function () {
console.log( 'onReachBottom' );
this .setData({reciterList: this .data.reciterList.concat([{name: 'a' }])});
},
onShow: function () {
console.log( 'onShow' );
},
switchTab: function (e) {
this .setData({
tab: {
current: e.currentTarget.dataset.index
}
});
},
fetchData: function () {
}
})
|
{
"usingComponents" : {
"list-item" : "../components/list_item/index"
},
"enablePullDownRefresh" : true ,
"onReachBottomDistance" : 50
}
|
事件在开发者工具和手机上都只能触发一次,正常么?如何触发多次?
我觉得scroll-view最大的问题是不能放<video>标签,好像是因为<video>标签不能放在包含overflow: auto的父容器内。overflow: visible倒没问题。
另外就是scroll-view没有明显的下拉动画,感觉有点奇怪。
另外
<
view
class
=
"layout"
>
<
view
class
=
"layout-header"
>
</
view
>
<
view
class
=
"home-content"
>
<!-- <view class="home">
<scroll-view scroll-y enable-back-to-top scroll-with-animation bindscrolltolower="loadMore" class="scroll-view">
<audio-background show="{{ show }}"></audio-background>
<view class="list">
<block wx:for="{{ items }}" wx:for-index="index" wx:for-item="item" wx:key="id">
<item item="{{ item }}"></item>
</block>
</view>
</scroll-view> -->
<
view
class
=
"home"
>
<
audio-background
show
=
"{{ show }}"
></
audio-background
>
<
view
class
=
"list"
>
<
block
wx:for
=
"{{ items }}"
wx:for-index
=
"index"
wx:for-item
=
"item"
wx:key
=
"id"
>
<
item
item
=
"{{ item }}"
index
=
"{{ index }}"
></
item
>
</
block
>
</
view
>
</
view
>
</
view
>
<
view
class
=
"layout-footer"
></
view
>
</
view
>
.layout {
position
:
absolute
;
top
:
0
;
right
:
0
;
bottom
:
0
;
left
:
0
;
height
:
100%
;
width
:
100%
;
display
: flex;
flex-
direction
: column;
flex-shrink:
0
;
}
.home-content {
display
: flex;
flex:
1
1
auto
;
overflow
:
visible
;
position
:
relative
;
}
我是这样写的,可以触发多次。看不出来你的bug出在哪
把那个属性去掉了使用view也只能触发一次
嗯嗯,忽略那个属性,我之前想用scroll-view,结果发现炒鸡难用,还麻烦。就切回他们官方提供的上拉和下拉刷新了。结果,,,就出现了我说的这个bug
<
view
class
=
"reciter-content"
scroll-y
=
"{{true}}"
>
view也有scroll-y属性吗,不是scroll-view才有吗?
用了scroll-view之后onReachBottom是只会触发一次的。
你好,问题已复现,我们会在后续版本中进行修复。