收藏
回答

自定义组件中使用ScrollView,scroll-top属性失效

<scroll-view style='height:50px;background:#ff0000' scroll-y scroll-top="100">
    <view>1</view>
    <view>2</view>
    <view>3</view>
    <view>4</view>
    <view>5</view>
    <view>6</view>
    <view>7</view>
</scroll-view>

上述代码用在小程序自定义组件中`scroll-top`属性不起作用

回答关注问题邀请回答
收藏

4 个回答

  • LastLeaf
    LastLeaf
    2018-05-08

    这里要注意:scroll-top 是仅在设置的时刻生效的值。


    hidden 属性会跳过节点及其子节点的布局计算,所以 scroll-top 在 hidden 为 true 时不会生效。因为 scroll-top 是仅在设置的时刻生效的值,因而在 hidden 变为 false 之后需要再设置一次 scroll-top 才行。前两种情况都是这个原因(与是否在自定义组件中无关)。


    第三种情况,如果 products 初始为空或高度不足 100px ,则 scroll-top 不会生效。因为 scroll-top 是仅在设置的时刻生效的值,因而products 改变之后需要再设置一次 scroll-top 才行。

    2018-05-08
    有用 1
    回复
  • LastLeaf
    LastLeaf
    2018-05-07

    你好,直接将你这段代码贴到自定义组件中未能复现问题。请提供一下可复现问题的代码片段。

    2018-05-07
    有用
    回复
  • 2018-05-08

    第一种情况:

    自定义组件

    <scroll-view style='height:50px;background:#ff0000' scroll-y scroll-top="100">
      <view>1</view>
      <view>2</view>
      <view>3</view>
      <view>4</view>
      <view>5</view>
      <view>6</view>
      <view>7</view>
    </scroll-view>

    在引用自定义组件的wxml文件中

    <view hidden='{{!hidden}}'>
      <test id='test'/>
    </view>

    其中`hidden`在data中初始化直接引用显示正常,但是在API请求成功后修改`hidden`字段后`scroll-top`失效。


    第二种情况

    自定义组件

    <view hidden="{{info !== null}}">
      <scroll-view style='height:50px;background:#ff0000' scroll-y scroll-top="100">
        <view>1</view>
        <view>2</view>
        <view>3</view>
        <view>4</view>
        <view>5</view>
        <view>6</view>
        <view>7</view>
      </scroll-view>
    </view>

    当动态修改info 时,scroll-top失效。


    第三种情况

    自定义组件

    <scroll-view scroll-y style="height:100px;background:#ff0000" scroll-top="100">
        <block wx:key="key" wx:for="{{products}}">
          <view>{{index}}</view>
        </block>
    </scroll-view>

    使用block 标签,scroll-top失效。

    2018-05-08
    有用 1
    回复
  • 2018-05-08

    非常感谢!

    2018-05-08
    有用
    回复 2
    • 海陽
      海陽
      2021-11-26
      为什么我把block标签去掉后还是失效
      2021-11-26
      回复
    • 海陽
      海陽
      2021-11-26
      没事了,解决了
      2021-11-26
      回复
登录 后发表内容