微信小程序人工智能之学生信息列表

首先我们要做一个人脸识别的小程序，第一步是先获取信息

学生列表页面

wxml代码为

<!--pages/studentlist/studentlist.wxml-->
<view class="page">
  <view class="page__bd">
    <view class="weui-panel weui-panel_access">
      <view class="weui-panel__hd">
        <view class="weui-cell__bd">学生列表</view>
         <view class="page__bd"> 
         <view class="weui-search-bar"> 
            <view class="weui-search-bar__form">
                <view class="weui-search-bar__box">
                    <icon class="weui-icon-search_in-box" type="search" size="14"></icon>
                    <input type="text" class="weui-search-bar__input" placeholder="请输入学号或姓名" value="{{condition}}" focus="{{inputShowed}}" bindinput="inputTyping" />
                </view>
                <label class="weui-search-bar__label" hidden="{{inputShowed}}" bindtap="showInput">
                    <icon class="weui-icon-search" type="search" size="14"></icon>
                    <view class="weui-search-bar__text">搜索</view>
                </label>
            </view>
             <view class="weui-search-bar__cancel-btn" bindtap="search">搜索</view> 
        </view>
     </view> 
       </view> 
      
      <view class="weui-panel__bd" wx:for="{{list}}" wx:key="list">
        <navigator url="../headimg/headimg?id={{item.id}}" class="weui-media-box weui-media-box_appmsg" hover-class="weui-cell_active">
          <view class="weui-media-box__hd weui-media-box__hd_in-appmsg">
            <image class="weui-media-box__thumb" src="{{item.path}}" />
          </view>
          <view class="weui-media-box__bd weui-media-box__bd_in-appmsg">
            <view class="weui-media-box__title">{{item.no}}</view>
            <view class="weui-media-box__desc">{{item.name}} {{item.sex}} {{item.age}}</view>
          </view>
        </navigator>
      </view>
    </view>
  </view>
</view>

js代码为

// pages/studentlist/studentlist.js
//获取应用实例
const app = getApp()
var page=1;
var isfinish=false;//加载完毕

function loadmore(that){
  if(isfinish) return;

  wx.showLoading({
    title: '正在加载中',
  })
  wx.request({
    url: app.globalData.url.index,
    header:{
      Cookie:wx.getStorageSync('session_id')
    },
    data: {
      page: page,
      condition: that.data.condition
    },
    success: (res) => {
      wx.hideLoading();
      console.log(res.data);
       //缓存
        wx.setStorage({
          key: "list",
          data: res.data
        })
      if (res.data.length > 0) {
        var list = that.data.list;

        for (var i = 0; i < res.data.length; i++) {
          list.push(res.data[i]);
        }
        that.setData({ list: list });
        page++;
      } else {
        isfinish = true;
      }
      wx.stopPullDownRefresh();
    }
  })
}

Page({
  data: {
    inputShowed: false,
    // inputVal: "",
    list:[],
    condition:''//查询
  },
//搜索
  showInput: function () {
    this.setData({
      inputShowed: true,
    });
  },
  search: function () {
    page = 1,
      isfinish = false,
      this.setData({
        inputShowed: true,
        list: []
      });
    loadmore(this)
  },
  inputTyping: function (e) {
    this.setData({
      condition: e.detail.value
    });
  },
  //监听页面加载
  onLoad: function (options) {
    page=1;
  },
  onShow:function(e){
    var that=this;
    loadmore(that);
  },
//页面相关事件处理函数--监听用户下拉动作
  onPullDownRefresh: function () {
  //  console.log('正在下拉加载...');
  page=1;
  isfinish=false;
  this.setData({list:[]});
  loadmore(this);
  },
  //页面上拉触底事件的处理函数
  onReachBottom: function () {
    // console.log('正在上拉加载...');
    var that=this;
    loadmore(that);
  },
})