小程序
小游戏
企业微信
微信支付
扫描小程序码分享
建议微信小程序支持swiper组件支持内嵌scroll-view组件的功能
22 个回答
加粗
标红
插入代码
插入链接
插入图片
上传视频
这样的话要如何解决呢，因为swiper响应太过于灵敏，scroll-view就无法获取到事件了。
你好，麻烦通过点击下方“反馈信息”按钮，提供出现问题的。
感觉也有可能是swiper响应了事件，所以scrollview无法响应事件了
{
"enablePullDownRefresh"
:
false
}
index.wxml
<!--index.wxml-->
<view
class
=
"container"
>
"nav"
></view>
<swiper style=
"height:{{pageHeight}}px; margin-top:37px;"
<swiper-item>
<scroll-view
"content"
scroll-y=
"{{true}}"
style=
"height:100%;"
"v1"
<text>
1111
</text>
</view>
<text>底部</text>
</scroll-view>
</swiper-item>
222222
</swiper>
index.wxss
.container {
display: block;
/* overflow: hidden; */
.nav {
width:
100
%;
height: 37px;
background-color: orange;
position: fixed;
top:
0
;
left:
z-index:
9999999
.content {
display: flex;
flex-direction: column;
background-color: purple;
.v1 {
height: 200rpx;
background-color: darkblue;
margin-top: 20rpx;
index.js
//index.js
//获取应用实例
var
app = getApp()
Page({
data: {
},
onLoad:
function
() {
onReady:
sysInfo = wx.getSystemInfoSync();
console.log(sysInfo);
this
.setData({
"pageHeight"
: sysInfo.windowHeight -
37.1
});
})
上述代码 在滑动scroll-view的时候，会存在scroll-view不响应滑动的问题，必须抬起手指再次滑动才会触发，这个是什么情况呀，谢谢啦。
貌似嵌套在ios系统中会有问题，Android中不知道， scroll-view经常不响应事件，好像被 widow或者Page响应了， 不知道如何解决。
已经解决了，谢谢
@ LastLeaf 但是，我加了 scroll-y="true"，style="height: 100%;"纵向滚动也不可以
那一块的代码如下：
<swiper-item class="item-list" > <view class="list-view"> <view class="classname"> <scroll-view class="scro" scroll-x="true" scroll-y="true" enable-back-to-top="true" style="height: 100%;" overflow="auto">
在<swiper-item>里嵌套scroll-view，也给了scroll-view height: 100%，还是无法滑动
@LastLeaf
不好意思，是我用法错误。
正确的用法是<swiper-item>里嵌套scroll-view。
不过还是感谢回复！
现在这种用法似乎已经不支持了，还有其它办法在swiper里实现纵向滚动吗？
正在加载...
关注后，可在微信内接收相应的重要提醒。
请使用微信扫描二维码关注 “微信开放社区” 公众号
这样的话要如何解决呢，因为swiper响应太过于灵敏，scroll-view就无法获取到事件了。
感觉也有可能是swiper响应了事件，所以scrollview无法响应事件了
{"enablePullDownRefresh":false}index.wxml
<!--index.wxml--><viewclass="container"><viewclass="nav"></view><swiper style="height:{{pageHeight}}px; margin-top:37px;"><swiper-item><scroll-viewclass="content"scroll-y="{{true}}"style="height:100%;"><viewclass="v1"><text>1111</text></view><viewclass="v1"></view><viewclass="v1"></view><viewclass="v1"></view><viewclass="v1"></view><viewclass="v1"></view><viewclass="v1"><text>底部</text></view></scroll-view></swiper-item><swiper-item><scroll-viewclass="content"scroll-y="{{true}}"style="height:100%;"><viewclass="v1"><text>222222</text></view><viewclass="v1"></view><viewclass="v1"></view><viewclass="v1"></view><viewclass="v1"></view><viewclass="v1"></view><viewclass="v1"><text>底部</text></view></scroll-view></swiper-item></swiper></view>index.wxss
.container {display: block;/* overflow: hidden; */}.nav {width:100%;height: 37px;background-color: orange;position: fixed;top:0;left:0;z-index:9999999;}.content {display: flex;width:100%;flex-direction: column;background-color: purple;}.v1 {width:100%;height: 200rpx;background-color: darkblue;margin-top: 20rpx;}index.js
//index.js//获取应用实例varapp = getApp()Page({data: {},onLoad:function() {},onReady:function() {varsysInfo = wx.getSystemInfoSync();console.log(sysInfo);this.setData({"pageHeight": sysInfo.windowHeight -37.1});}})上述代码 在滑动scroll-view的时候，会存在scroll-view不响应滑动的问题，必须抬起手指再次滑动才会触发，这个是什么情况呀，谢谢啦。
貌似嵌套在ios系统中会有问题，Android中不知道， scroll-view经常不响应事件，好像被 widow或者Page响应了， 不知道如何解决。
已经解决了，谢谢
@ LastLeaf 但是，我加了 scroll-y="true"，style="height: 100%;"纵向滚动也不可以
那一块的代码如下：
<swiper-item class="item-list" >
<view class="list-view">
<view class="classname">
<scroll-view class="scro" scroll-x="true" scroll-y="true"
enable-back-to-top="true" style="height: 100%;"
overflow="auto">
在<swiper-item>里嵌套scroll-view，也给了scroll-view height: 100%，还是无法滑动
@LastLeaf
不好意思，是我用法错误。
正确的用法是<swiper-item>里嵌套scroll-view。
不过还是感谢回复！
现在这种用法似乎已经不支持了，还有其它办法在swiper里实现纵向滚动吗？