SoFunction
Updated on 2025-03-01

The example code of WeChat applet uses scroll-view tag to achieve automatic sliding to the bottom function

The specific code is as follows:

// -y="true" Y-axis scrolling// 2. It should be set to be high// 3. Use the scroll-top attribute to scroll to the bottom. Scroll-top does not bring units<scroll-view scroll-y="true" style="height:{{height-50}}px;" scroll-top="{{scrollTop}}">
 <block wx:for="{{recordList}}" wx:key="">
 <view>
 <text>{{}}</text>
 </view
 </block>
</scroll-view>

Page({
 data: {
 // List recordList:'',
 height: '',
 scrollTop: 0
 },
 onLoad: function (options) {
 // Get the height of the current window var height = ().windowHeight;
 // Below is an http request I encapsulated ().then(res => {
 //res is the data returned after the request is successful  if ( === 0) {
  var length = 
  ({
  // Assign the obtained List to recordList   'recordList': ,
   // 1. Calculate the height of the label of each item on the page   // 2. Use the array to obtain the length of the List * the height of each item label (400 is what I have visually tested, but to put it bluntly, it is written nonsense. Anyway, it must be higher than the height of each item, as long as it is high enough.)   'scrollTop': length * 400
  })
  }
 })
 }
})

Summarize

The above is the example code of the WeChat applet using the scroll-view tag to achieve automatic sliding to the bottom function. I hope it will be helpful to everyone. If you have any questions, please leave me a message and the editor will reply to everyone in time. Thank you very much for your support for my website!