谜之Bug,iPhone上没有,只在安卓上复现
发布于 5 年前 作者 agao 3492 次浏览 来自 问答

横向无法拖动,iPhone上可以拖动。

wxml

<!--index.wxml-->
<view class="container" style="background-image:url({{geubimage}})">
  <view class="head">
    <scroll-view class="geub-list" scroll-x>
      <view class="item active">
        <image src="https://bed.sihuhello.com/images/Ch4A8QtiD7.jpg" mode="aspectFit"></image>
        <view class="xnxi">
          <view class="name">陈一发儿</view>
          <view class="ffsi">粉丝:1万</view>
        </view>
      </view>
      <view class="item">
        <image src="https://bed.sihuhello.com/images/Ch4A8QtiD7.jpg" mode="aspectFit"></image>
      </view>
      <view class="item">
        <image src="https://bed.sihuhello.com/images/Ch4A8QtiD7.jpg" mode="aspectFit"></image>
      </view>
      <view class="item">
        <image src="https://bed.sihuhello.com/images/Ch4A8QtiD7.jpg" mode="aspectFit"></image>
      </view>
      <view class="item">
        <image src="https://bed.sihuhello.com/images/Ch4A8QtiD7.jpg" mode="aspectFit"></image>
      </view>
      <view class="item">
        <image src="https://bed.sihuhello.com/images/Ch4A8QtiD7.jpg" mode="aspectFit"></image>
        <view class="xnxi">
          <view class="name">陈一发儿</view>
          <view class="ffsi">粉丝:1万</view>
        </view>
      </view>
      <view class="item">
        <image src="https://bed.sihuhello.com/images/Ch4A8QtiD7.jpg" mode="aspectFit"></image>
      </view>
      <view class="item">
        <image src="https://bed.sihuhello.com/images/Ch4A8QtiD7.jpg" mode="aspectFit"></image>
      </view>
      <view class="item">
        <image src="https://bed.sihuhello.com/images/Ch4A8QtiD7.jpg" mode="aspectFit"></image>
      </view>
    </scroll-view>
  </view>
</view>

wxss

/**index.wxss**/
 
.container {
  width: 100%;
  padding: 0;
  position: fixed;
  background-attachment: fixed;
  background-repeat: no-repeat;
  background-size: cover;
  justify-content: center;
}
 
/* head */
 
.head {
  width: 100%;
}
 
.head .geub-list {
  width: 100%;
  height: 200rpx;
  white-space: nowrap;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
 
.head .item {
  width: 200rpx;
  margin: 25rpx 10rpx;
  background: rgba(100, 100, 100, 0.2);
  display: inline-flex;
  overflow: hidden;
  justify-content: space-between;
  align-items: center;
}
 
 
.head .item image {
  width: 200rpx;
  height: 200rpx;
}
 
.head .item .xnxi {
  width: 180rpx;
  color: #fff;
  font-size: 13pt;
  display: none;
}

js

//index.js
//获取应用实例
var app = getApp()
Page({
    data: {
        motto: 'Hello World',
        geubimage:"https://bed.sihuhello.com/images/nWp5F3MHmT.jpg?x-oss-process=image/resize,m_fixed,h_1600,w_900",
        userInfo: {}
    },
    //事件处理函数
    bindViewTap: function () {
        wx.navigateTo({
            url: '../logs/logs'
        })
    },
    onLoad: function () {
        console.log('onLoad')
        var that = this
        //调用应用实例的方法获取全局数据
        app.getUserInfo(function (userInfo) {
            //更新数据
            that.setData({
                userInfo: userInfo
            })
        })
    }
})
回到顶部