目录
做了一个列表
使用了控件
<u-tabs :list="news_type_list" :current="current" @change="change"></u-tabs>
<block v-for="video in video_list">
<u-card @tap="detail(d.postid)">
<view slot="head" class="u-line-1 u-font-12">
{{d.title}}
</view>
<view slot="body">
<view class="u-line-3">
{{d.digest}}
</view>
<image :src="d.imgsrc"></image>
</view>
<view slot="foot">
{{d.ptime}}
</view>
</u-card>
</block>
关键点
data() {
return {
video_list: [],
news_type_list: [{
name: '精品视频'
}, {
name: '搞笑视频'
}, {
name: '美女视频'
}, {
name: '体育视频'
}],
current: 0,
page: 10
}
},
这里page的初始值不能是0
难点
methods: {
load_videos_data(){
uni.request({
url: 'https://api.isoyu.com/api/Video/video_type?type=' + this.current +
'&page=' + this.page,
success: (res) => {
console.log(JSON.stringify(res));
//this.video_list = res.data.data
res.data.data.map(item => {
this.video_list.push(item)
})
}
});
},
change(index) {
this.current = index;
this.video_list=[]
this.load_videos_data()
}
},
onReachBottom() {
if(this.page>400){
this.status="nomore"
return
}
this.page = this.page+10;
this.load_videos_data()
},
1.返回的值是个数组,要在其中push每一项
2.导航切换,清空原有数据,重新加载,否则会显示上一个栏目的数据
3.触底,页数加10
文章详细页面
export default {
data() {
return {
article:{
title:''
},
show:true,
postid:''
}
},
onLoad(data) {
// let postid='FLOC3DLN0001899O'
this.postid = data.postid
this.loadArcticleData()
},
methods: {
loadArcticleData(){
console.log(this.postid)
uni.request({
url: 'https://api.isoyu.com/api/News/new_detail?postid='+this.postid,
method:'GET',
success: (res) => {
// console.log(res)//错误,返回obj
console.log(JSON.stringify(res))//正确
let imgs = res.data.data.img
let body = res.data.data.body
imgs = JSON.parse(JSON.stringify(imgs))
for (var i = 0; i < imgs.length; i++) {
//解析的时候要用img标签
let imgsrc = '<img src=\"'+imgs[i].src+'\"></img>'
console.log(imgsrc)
body = body.replace(imgs[i].ref, imgsrc)
}
this.article = res.data.data
this.article.body = body
this.show=false
uni.setNavigationBarTitle({
title: res.data.data.title
});
},
fail: (res) => {
console.log(JSON.stringify(res))
this.show=false
},
});
},
},
}
传递posid