微信小程序

this在文件中需定义变量操作

js文件部分代码

Page({
  data: {
    searchKeyword: '',  //需要搜索的字符  
    searchList: [], //放置返回数据的数组  
    isFromSearch: true,   // 用于判断searchList数组是不是空数组，默认true，空的数组  
    searchPageNum: 1,   // 设置加载的第几次，默认是第一次  
    searchPageCount:20,//分页条数
    callbackcount: 15,      //返回数据的个数  
    searchLoading: false, //"上拉加载"的变量，默认false，隐藏  
    searchLoadingComplete: false,  //“没有数据”的变量，默认false，隐藏 
    // 页面总高度将会放在这里
    windowHeight: 0,
    // header的高度
    headerHeight: 0,
    // scroll-view的高度
    scrollViewHeight: 0,
    tempImgData:[],//图片临时存放
  },
  onLoad: function (option) {
    let that = this;
    // 先取出页面高度 windowHeight
    wx.getSystemInfo({
      success: function (res) {
        that.setData({
          windowHeight: res.windowHeight
        });
      }
    });
    console.log("windowHeight:" + that.data.windowHeight)
    // 然后取出navbar和header的高度
    // 根据文档，先创建一个SelectorQuery对象实例
    let query = wx.createSelectorQuery().in(this);
    // 然后逐个取出navbar和header的节点信息
    // 选择器的语法与jQuery语法相同
    query.select('#searchBar').boundingClientRect();

    // 执行上面所指定的请求，结果会按照顺序存放于一个数组中，在callback的第一个参数中返回
    query.exec((res) => {
      // 分别取出navbar和header的高度
      let headerHeight = res[0].height;

      // 然后就是做个减法
      let scrollViewHeight = this.data.windowHeight - headerHeight;
      console.log("scrollViewHeight:" + scrollViewHeight)
      // 算出来之后存到data对象里面
      this.setData({
        scrollViewHeight: scrollViewHeight
      });
    });
    that.fetchSearchList();
  },
})

.wxml

<view class="search">
  <view id="searchBar" class="search-bar">
    <view class="search-wrap">
      <icon type="search" size="16" class="icon-search" />
      <input type="text" placeholder="请输入搜索内容" class="search-input" name="searchKeyword" bindinput="bindKeywordInput" value="{{searchKeyword}}" />
    </view>
    <view class="search-cancel" bindtap="keywordSearch">搜索</view>

    <navigator url="../myinfo/myinfo" open-type="navigate">
      <view class="search-cancel">上传</view>
    </navigator>

  </view>
  <view>
    <scroll-view scroll-y="true" style="height: {{scrollViewHeight}}px;" bindscrolltolower="searchScrollLower">
      <view style="flex-direction:column;display: flex;">
        <view id="demo1" style="position:relative;font-size: 36rpx;padding:3px;flex-direction:row;display: flex;border-bottom:1px;" wx:for="{{searchList}}" wx:key="unique" data-data="{{item}}">
          <image style="width:250px;height:180px;" mode="widthFix" src="{{item.filePath}}"></image>
          <view style="flex-direction:column;font-size:30rpx;position:relative;display: flex;height:60px;padding-top:10px;">
            <text style="font-size:28rpx;color: #BEBEBE;">{{item.name}}</text>
            <text style="font-size:30rpx;color: #BEBEBE;">{{item.message}}</text>
          </view>
        </view>
        <view style="margin: 0 auto;width: 450rpx;height: 2rpx;background-color: #D8D8D8;"></view>
      </view>
      <view class="loading" hidden="{{!searchLoading}}">正在载入更多...</view>
      <view class="loading complete" hidden="{{!searchLoadingComplete}}">已加载全部</view>
    </scroll-view>
  </view>
</view>

let that = this;

函数中的this与当前的this不同；

动态获取页面的高度

windowHeight页面总长度
header的高度headerHeight
scroll-view的高度scrollViewHeight