
<!--pages/news/news.wxml-->
<view class="tool-tip " wx:if="{{popMsg}}">
<text class="{{popType}}">{{popMsg}}</text>
</view>
<view>
<view wx:if="{{isNotData}}" class="isNotDataHint">
<view class="iconfont icon-xiaoxi"></view>
<text>暂无消息</text>
</view>
<view class="list">
<view class="item" wx:for="{{newsList}}" wx:for-item="item" wx:key="*this">
<view class="h2">
<text class="iconfont icon-markfill {{item.look==0?'energized':'grey'}} "
style="font-size: 1rem!important;"></text>
{{item.title}}
<text class="status">{{item.look==0?'未读':'已读'}}</text>
<text class="item-note right-1">{{item.createdate }}</text>
</view>
<view class="p" style="padding-left: 1.1rem; white-space: normal;">{{item.content}}</view>
</view>
</view>
<view class="padding-top"></view>
</view>
|
/* pages/news/news.wxss */
.status {
display: inline-block;
font-size: 0.8rem;
color: #f26604;
border: 1px solid #f26604;
padding: 0 2px!important;
border-radius: 2px;
margin: -0.1rem 0.2rem 0.2rem;
}
|
// pages/news/news.js
//获取应用实例
var app = getApp();
var util = require('../../utils/util.js');
Page({
/**
* 页面的初始数据
*/
data: {
page: 1,
hasData: true,
isNotData:true,
newsListArr: []
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
util.isLoginModal();
//获取消息列表
this.getNewsList(this.data.page);
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
this.setData({
page: 1
})
//获取消息列表
this.getNewsList(this.data.page);
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
if (!this.data.hasData) {
return;
}
//获取消息列表
this.getNewsList(this.data.page);
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
},
/**
* 获取消息列表
*/
getNewsList: function (page) {
var that = this;
util.https(app.globalData.api + "/api/MessagePush/getlist", "GET", {
page: page,//页码
size: 10,//条数
userid: wx.getStorageSync("userid"),//用户id
isHideLoad:true
},
function (data) {
if (that.data.page == 1) {
that.setData({
newsListArr: []
})
}
for (var index in data.data.data_list) {
that.data.newsListArr.push(data.data.data_list[index]);
}
that.setData({
hasData: data.data.page_count == that.data.page ? false : true,
isNotData: (data.data == null || data.data.data_list == 0) ? true : false,
newsList: that.data.newsListArr
})
that.data.page++;
}
)
}
})
|
模板简介:该模板名称为【微信小程序蓝色风格个人消息页面设计制作开发教程】,大小是,文档格式为.,推荐使用打开,作品中的图片,文字等数据均可修改,图片请在作品中选中图片替换即可,文字修改直接点击文字修改即可,您也可以新增或修改作品中的内容,该模板来自用户分享,如有侵权行为请联系网站客服处理。欢迎来懒人模板【小程序教程】栏目查找您需要的精美模板。