| 学习时间 | 1h |
| 代码行数 | 50行 |
| 博客量 | 2篇 |
| 学习内容 |
主要进行了《从小工到大工》的阅读，并且 对代码进行了优化 |
<template>
<view class="index">
<index-header bgColor="bg-index-header" @headerSwitch="headerSwitch"/>
<!-- 视频组件 -->
<video style="height:200px;width: 350px;"src="https://woushiwzy.oss-cn-beijing.aliyuncs.com/1c8881e9-391c-43b4-acfc-c445a5a52765.mp4"></video>
<!-- <cu-video class="video" :video_list="videoList"/ -->>
</view>
</template>
<script>
import indexHeader from '@/components/index-header.vue';
import cuVideo from '@/components/cu-video.vue';
export default {
components: {
indexHeader,
cuVideo
},
data() {
return {
title: 'Hello',
videoList:[]
}
},
onl oad() {
this.getVideoList();
},
onShow() {
console.log('界面显示')
},
methods: {
getVideoList(refresh) {
uni.request({
url: 'https://api.52170.xin/video',
dataType: 'json',
success: res => {
console.log(res.data.data.list);
for (let item of res.data.data.list) {
this.videoList.push({
video_id: item.video_id,
nickname: item.nickname,
video_describe: item.video_describe,
cover_url: item.cover_url,
video_url: item.video_url,
dianzan: item.dianzan,
pinglun: item.pinglun,
zhuanfa: item.zhuanfa,
is_dianzan: item.is_dianzan,
flag: false
});
}
}
});
},
// 顶部切换
headerSwitch(val){
// console.log(val);
this.getVideoList();
}
}
}
</script>
<style lang="less">
.index {
display: flex;
flex-direction: column;
/* align-items: center; */
justify-content: center;
background-color: #333333;
height: 100vh;
}
.tabbar{
.action{
.plus{
image{
width: 100upx;
height: 60upx;
}
}
}
}
</style>
标签：dianzan,2024.04,console,17,url,item,video,data From： https://www.cnblogs.com/dmx-03/p/18204438