- 序号
- 编号
- 时间
- 等级
- 照片
{{key+1}}
{{item.number}}
{{item.level===1?'重要':'普通'}}
没有更多消息了
import InfiniteLoading from "vue-infinite-loading";
import dateView from "./../views/date-view.vue";
// const api = "http://hn.algolia.com/api/v1/search_by_date?tags=story";
export default {
components: {
InfiniteLoading,
"date-view": dateView
},
data() {
return {
list: []
};
},
methods: {
// $state 方法
infiniteHandler($state) {
let params = {
pageNum: this.list.length / 20 + 1
};
this.$ajax
.get(
"/openapi/sqrj/h5/findByVillage?status=2&pageSize=20&pageNum=" +
params.pageNum,
params
)
.then(res => {
//通过接口获取到list 通过传参 pageNum 来控制请求的数据
console.log(res.data.result, "res.data.result.list.length");
console.log(this.list.length, res.data.result.total);
if (res.data.result.list.length) {
//如果接口list里面有值 那么进行下一步操作
this.list = this.list.concat(res.data.result.list); //将请求到的接口list:res.data.result.list 合并到this.list里面,这样现在在页面的list就合并进去了
console.log(this.list, "data");
$state.loaded(); //这一步操作相当于监听上拉动作改变pageNum的值重新发送请求
if (this.list.length === res.data.result.total) { //如果this.list的长度等于请求接口里面的数据的总长度,那么提示已经没有新数据了
$state.complete();
}
} else {
$state.complete();
}
});
}
// onInfinite() {
// let params = {
// pageNum: this.list.length / 20 + 1
// }
// this.$ajax.get('/openapi/sqrj/h5/findByVillage?status=2&pageSize=20&pageNum='+params.pageNum,params).then((res)=>{
// //通过接口获取到list 通过传参 pageNum 来控制请求的数据
// console.log(res.data.result,'res.data.result.list.length');
// console.log(this.list.length,res.data.result.total);
// if (res.data.result.list.length) { //如果接口list里面有值 那么进行下一步操作
// this.list = this.list.concat(res.data.result.list); //将请求到的接口list:res.data.result.list 合并到this.list里面,这样现在在页面的list就合并进去了
// console.log(this.list,'data');
// this.$refs.infiniteLoading.$emit('$InfiniteLoading:loaded'); //这一步操作相当于监听上拉动作改变pageNum的值重新发送请求
// if (this.list.length=== res.data.result.total) { //如果this.list的长度等于请求接口里面的数据的总长度,那么提示已经没有新数据了
// this.$refs.infiniteLoading.$emit('$InfiniteLoading:complete');
// }
// }
// else {
// this.$refs.infiniteLoading.$emit('$InfiniteLoading:complete');
// }
// })
// // this.$ajax.get('/openapi/wc/h5/findByVillage?userId=294259047560044&pageSize=20&pageNum='+params.pageNum,params).then((res)=>{
// // console.log(res.data.result.list.length,'res.data.result.list.length');
// // if (res.data.result.list.length) {
// // this.list = this.list.concat(res.data.result.list);
// // console.log(this.list,'data');
// // this.$refs.infiniteLoading.$emit('$InfiniteLoading:loaded');
// // if (this.list.length / 20 === 20) {
// // this.$refs.infiniteLoading.$emit('$InfiniteLoading:complete');
// // }
// // } else {
// // this.$refs.infiniteLoading.$emit('$InfiniteLoading:complete');
// // }
// // })
// // this.$ajax.get(api, params).then((res) => {
// // console.log(res.data.hits.length,'res.data.hits.length');
// // if (res.data.hits.length) {
// // this.list = this.list.concat(res.data.hits);
// // console.log(this.list,'this.list');
// // this.$refs.infiniteLoading.$emit('$InfiniteLoading:loaded');
// // if (this.list.length / 20 === 20) {
// // this.$refs.infiniteLoading.$emit('$InfiniteLoading:complete');
// // }
// // } else {
// // this.$refs.infiniteLoading.$emit('$InfiniteLoading:complete');
// // }
// // })
// },
}
};
.list {
overflow: hidden;
margin: 20px 0;
}
span {
float: left;
margin-right: 5px;
}
p {
float: left;
}
.positionfixd {
position: fixed;
top: 0;
left: 0;
width: 100%;
ul {
padding: 0;
margin: 0 0 0 8px;
li {
display: inline-block;
width: 19%;
height: 30px;
line-height: 30px;
text-align: center;
font-size: 14px;
background-color: #ccc;
color: #fff;
border: 1.5px solid #000;
border-right: none;
}
}
}
table {
margin-top: 30px;
tr {
td {
width: 20%;
height: 30px;
line-height: 30px;
text-align: center;
font-size: 14px;
}
.td1 {
width: 15%;
}
.td2 {
width: 25%;
// span{
// display: inline-block;
// text-align: center;
// }
}
.tdimg {
img {
width: 100%;
height: 100%;
}
}
}
}