[微信小程序]scroll-view里面显示表格 [表格真有点看不懂呢。]


这是一个用scroll-view里面用view设计的表格,希望第一列能垂直居中,研究了好多天,就是没结果

  • 首先谢谢你的支持,但我不知道,这个代码是否经过测试 wxml的结构肯定不完整,第二 我研究了很久,你这样设置,左右滑动是不可能 .sv的className没有 浪费了半小时,还是没能解决问题。 , 我现在有点喜欢你了 怎么办
    • 代码肯定是经过测试的,wxml给你缩短一点,让你看清楚结构,之前发的wxml代码因为超过长度自动截取的缘故,你之前的提问只是需要垂直居中,并没有说什么左右滑动,提问题要有提问题的方法吧 <view class='table'> <view class='table-head'> <view class='table-head-item'>星期</view> <view class='table-head-item'>班级</view> <view class='table-head-item'>节次</view> </view> <scroll-view scroll-y style="height: 150rpx;"> <view class='table-items'> <view class='table-items-item'>一</view> <view class='table-items-item'> <view>语文</view> <view>三年2班</view> </view> <view class='table-items-item'>科目</view> </view> <view class='table-items'> <view class='table-items-item'>一</view> <view class='table-items-item'> <view>语文</view> <view>三年2班</view> </view> <view class='table-items-item'>科目</view> </view>         </scroll-view> </view> , 说的貌似很有深意,你能一条一条说么?
    • 我把所有代码进行整理,我要的是左右滑动,你这个只能上下滑动,上下简单,左右也行,就是单元格里面无法垂直居中, 还是来点易于消化的食物吧。
    • 左右滑动只是简单的把scroll-y改成scroll-x,这是小程序组件的基础属性,垂直居中可以用flex布局轻松搞定,这也只是开发小程序的基础能力,不要什么都是拿来主义,没有人必须为你解决基础问题,好自为之, 怎么了
  • flex布局的align-items:center; wxss: .table{ background: #f0f0f0; } .table-head{ padding:20rpx; display: flex; justify-content: space-between; } .table-items{ background: #fff; padding:20rpx; display: flex; justify-content: space-between; align-items:center;/*垂直居中*/ text-align: center; border-bottom:1rpx solid #f0f0f0; } wxml: <view class='table'> <view class='table-head'> <view class='table-head-item'>星期</view> <view class='table-head-item'>班级</view> <view class='table-head-item'>节次</view> </view> <scroll-view scroll-y style="height: 200px;" class='sv'> <view class='table-items'> <view class='table-items-item'>一</view> <view class='table-items-item'> <view>语文</view> <view>三年2班</view> </view> <view class='table-items-item'>科目</view> </view> <view class='table-items'> <view class='table-items-item'>一</view> <view class='table-items-item'> <view>语文</view> <view>三年2班</view> </view> <view class='table-items-item'>科目</view> </view>   <view class='table-items'> <view class='table-items-item'>一</view> <view class='table-items-item'> <view>语文</view> <view>三年2班</view> </view> <view class='table-items-item'>科目</view> </view> <view class='table-items'> <view class='table-items-item'>一</view> <view class='table-items-item'> <view>语文</view> <view>三年2班</view> </view> <view class='table-items-item'>科目</view> </view> <view class='table-items'> <view class='table-items-item'>一</view> <view class='table-items-item'> <view>语文</view> <view>三年2班</view> </view> <view class='table-items-item'>科目</view> </view> <view class='table-items'> <view class='table-items-item'>一</view> <view class='table-items-item'> <view>语文</view> <view>三年2班</view> </view> <view class='table-items-item'>科目</view> </view> <view class='table-items'> <view class='table-items-item'>一</view> <view class='table-items-item'> <view>语文</view> <view>三年2班</view> </view>     </scroll-view> </view> , 说的貌似很有深意,你能一条一条说么?
    • 好几个className没有:.sv、table-items-item,第二,你这个能实现左右滑动吗?根据我的经验,你的设计肯定不行。就算能左右滑动,也不可能水平居中,垂直居中, 对自己要求程度高的人,就更有可能达到更高的程度哦!
    • 都是同道中人,我也是研究了很久,花费了大把精力没办法,才上贴求助。因为我已经连续做了10几个小时,头有点晕,第一次是我没说清楚,后来说了,是要左右滑动,并要求每个单元格上下左右居中,单元格也有表格线。也百度了几十个帖子,没有找到能解决这个问题,估计也没人做出来。不要太傲气,人外有人。, 何止有人啊,还是高人啊