小技巧四则： 点击空白处隐藏input，下拉刷新，全局变量

一：点击空白处隐藏input，点击评论出现

wxml:

<scroll-view  style="height: {{windowHeight}}px; width: {{windowWidth}}px;" scroll-y="true" bindscrolltoupper="pullDownRefresh" bindscrolltolower="pullUpLoad" bindtap="click_blank">
<view wx:if="{{comment}}" class="comment-input"><input type="text" name="content" auto-focus placeholder-style="margin-top:-8rpx;" placeholder="{{comment_placeholder}}" bindchange="comment_input" /><button>发送</button></view>

js:

// 评论（点击空白处隐藏input，点击评论出现）
    click_blank:function(e){
        var flag = "";
        var comment_placeholder ="";
        if(e.target.dataset.comment==1){
            flag = true;
            comment_placeholder = e.target.dataset.username;
        }else{
            flag = false;
            comment_placeholder = "";
        }
        this.setData({
            comment:flag,
            comment_placeholder:"评论"+comment_placeholder+"动态"
        })
    },

二：下拉刷新

wxml:

<view wx:if="{{items}}">
<scroll-view scroll-y="true" bindscrolltoupper="upper" bindscrolltolower="lower" style="height: {{windowHeight}}px">
    <view wx:for="{{items}}">
        <view class="item">
            <view class="item-top">
                <view class="avatar" wx:if="{{item.avatar}}">
                    <image mode="aspectFill" src="{{'}}"></image>
                </view>
                <view class="avatar" wx:else><image mode="aspectFill" src="../img/default_img.png"></image></view>
                <view class="item-username">
                    <text>{{item.username}}{{item.jobname}}</text>
                </view>
                <view class="item-time">{{item.adddate}}</view>
            </view>
        </view>    
    </view>
    <view wx:if="{{hasMore}}">
        <view wx:if="{{nomore}}" class="tips">
            <text>没有更多内容了</text>
        </view>
        <view wx:else class="tips">
            <image src="../img/loading.gif" mode="aspectFill"/>
            <text>玩了命的加载中...</text>
        </view>
    </view>
</scroll-view>
<loading hidden="{{loading}}">加载中...</loading>

js:

Page({
data: {
windowHeight:"",//屏幕高
page:1,
totalPage:"",//总页数
nomore:false,//加载完所有信息显示
hasMore:true//加载时显示
},
// 加载
onLoad: function (e) {
console.log(this.data.page);
        this.getDataFromServer(this.data.page);
    },
    // 读取屏幕高度，赋值给scroll-view
    onShow: function( e ) {
wx.getSystemInfo( {
        success: ( res ) => {
this.setData( {
windowHeight: res.windowHeight
})
        }
})
},
// 上拉加载更多
    lower: function( e ) {
    var page = this.data.page+1;
    var nomore = this.data.nomore;
        if(page > this.data.totalPage){
        page = this.data.totalPage;
        nomore =true;
        }
        this.setData( {
          page: page,
          nomore:nomore
        })
        this.getDataFromServer( page );
        console.log( "上拉加载更多...." + page);
    },
    // 下拉返回
    upper: function( e ) {
    var page = this.data.page-1;
        if(page < 1){
        page = 1;
        }
        this.setData( {
          page: page
        })
        this.getDataFromServer( page );
        console.log( "下拉返回上页...." + page)
    },
    //获取网络数据的方法
    getDataFromServer: function (page) {
    console.log(page,this.data.totalPage);
        if(this.data.totalPage &&page > this.data.totalPage){
            page = this.data.totalPage;
        }
        var that = this;
        that.setData({
            loading: false,
            hasMore: true
        }),
        wx.request({
            url: 'url?p/'+page,
            data: {
                size: 10,
                parentsid: wx.getStorageSync('parentsid'),
                nurseryid: wx.getStorageSync('nurseryid'),
                classid: wx.getStorageSync('classid'),
                childid: wx.getStorageSync('childid')
            },
            header: {
                'Content-Type': 'application/json'
            },
            success:function(res) {
                if(res.statusCode = 200){
                    var items = res.data.dynamiclist;
                    that.setData({
                        items: items,
                        totalPage: res.data.totalPage,
                        loading: true, 
                        hasMore: false
                    });
                }else{
                    console.log("服务器异常");
                }
            }
        })
    }
})

wxss:

/*提示*/
.tips {
    font-size: 28rpx;
    text-align: center;
    padding: 50rpx;
    color: #ccc;
}
.tips image {
    width: 40rpx;
    height: 40rpx;
    margin-right: 20rpx;
}
.tips image,
.tips text {
    vertical-align: middle;
}

三：全局变量

微信小程序里面有个app.js，我们可以在这个里面设置全局变量，像酱

App({  
     data:{  
         servsers:""  
      }  
})  

在外面就这样引用就可以了，这个真的是简单

getApp().data.servsers  

四：更改navbar上面的文字

wx.setNavigationBarTitle({  
      title: '我是通过API设置的NavigationBarTitle'  
    })  

就酱便可以改变标题栏的文字了