微信小程序Scroll-view的一个心得

今天写小程序突然要用到Scroll_view看了网上好多的教程，然后自己写发现都不对，最后仔仔细细的看了一遍开发文档才知道那里错了。

当时是这样写的

<scroll-view scroll-y="true" scroll-into-view="{{toView}}" scroll-with-animation="true">
    <view wx:for="{{adressMessages}}"  id="{{item.ids}}">
        <text class='diming'>{{item.diming}}</text>
        ...
    </view>
</scroll-view>

<!这里设置浮动按钮，点击跳转>
 <view class='fudong'>
        <view wx:for="{{btnMessages}}">
            <view class='city'>
                <text bindtap='click' data-id="{{item.id}}">{{item.city}}</text>
            </view>
            <view><text decode="{{true}}">&nbsp;</text></view>
      </view>
</view>

只写一个浮动的css

.fudong{
    float: right;
     /* background-color: red; */
    position: fixed;
     bottom: 150px; 
    right: 10rpx;  
    /* border: 0 solid #ffffff; */
       /* border-radius: 25%;    */
    /* box-shadow: 4px 1px 1px #cccccc; */
     width: 50rpx; 
     height: auto; 
     font-size: 25rpx;
     font-weight: bold;
  }

data: {
      toView: '',
      adressMessages:[
          { 'diming': '杭州总部','ids':'ai'},
          { 'diming': '衢州分部','ids': 'bi' },
          { 'diming': '宁波分部','ids': 'ci' },
          { 'diming': '金华分部','ids': 'di'},
          { 'diming': '温州分部','ids': 'ei' },
          { 'diming': '绍兴分部','ids': 'fi' },
          { 'diming': '丽水分部','ids': 'gi' },
          { 'diming': '台州分部','ids': 'hi'},
      ],
      btnMessages:[
        {'city':'杭','id':'ai'},
        { 'city': '衢', 'id': 'bi' },
        { 'city': '宁', 'id': 'ci' },
        { 'city': '金', 'id': 'di' },
        { 'city': '温', 'id': 'ei' },
        { 'city': '绍', 'id': 'fi' },
        { 'city': '丽', 'id': 'gi' },
        { 'city': '台', 'id': 'hi' },
      ]
  
  },
 click:function(e){
        var id=e.currentTarget.dataset.id
       this.setData({
           toView:id
       })
    },

运行之后发现点击没什么反应，这里看开发文档如下：

所以我们要加一个height

 <scroll-view scroll-y="true" scroll-into-view="{{toView}}" scroll-with-animation="true" style="height: 500px;">