Home > WeChat Applet > Mini Program Development > Mini program development page pull-up to load data (with code)

Mini program development page pull-up to load data (with code)

不言
Release: 2019-01-23 10:53:23
forward
3417 people have browsed it

The content of this article is about page pull-up and loading data (with code) in the development of small programs. It has certain reference value. Friends in need can refer to it. I hope it will be helpful to you.

The requirement is to pull up and load data, but the actual requirement is to obtain paging data. The background is a normal ajax request for paging data. The applet part is a little more complicated. I checked some information and completed it. However, the link to the information cannot be found and cannot be put up for reference.

Mini program page

Involves data loop, the following is a simple example

 <view>
     <view>{{item.name}}</view>
     <view>{{item.age}}</view>
  </view>
Copy after login
MVVM development model (such as React, Vue) advocates combining rendering and logic separation. To put it simply, JS no longer needs to directly control the DOM. JS only needs to manage the state, and then use a template syntax to describe the relationship between the state and the interface structure.

JS part of the mini program

The JS part is responsible for obtaining data and splicing data

Page({

    /**
     * 页面的初始数据
     */
    data: {
        array: [],
        page: 1,
        isReachBottom: true // 是否上拉加载
    },

    // 获取数据
    getList: function () {
        var that = this;
        wx.request({
            url: 'https://xxx',
            data: {
                p: that.data.page
            },
            success: function (res) {
                if (res.data.message == 'success') {
                    // 获取成功,数据追加
                    var list = [];
                    var count = res.data.data.length
                    for (var i = 0; i <p>About pull-up and bottoming, and these features<br> </p><p><img src="https://img.php.cn/upload/image/374/797/427/1548211796238512.png" title="1548211796238512.png" alt="Mini program development page pull-up to load data (with code)"></p>
Copy after login

The above is the detailed content of Mini program development page pull-up to load data (with code). For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:segmentfault.com
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template