创建项目
创建项目,叫video_app。
在pages.json里面修改一下标题:
新建search搜索页面和me我的页面。
此时界面预览效果如下:
引入静态资源
主要是static里面的内容,全部复制过来。
配置底部导航栏
此时重启服务,重新预览,可以发现底部导航已经出来了。
开发首页
先在App.vue里面编写一个全局样式。
此时页面效果如下:
开发首页顶部轮播图
此时页面渲染效果如下:
修改pages.json,引用H5原生顶部导航栏:
此时页面效果如下:
这里会有两张图片,可以自动轮播,也可以手动切换,截图看不出这种效果来。
开发热门短剧标题
效果预览:
开发热门短剧横向轮播图
效果预览:
本教程讲解了uniapp开发短视频小程序的入门教程,主要讲解了如何配置底部导航,如何开发顶部轮播图以及热门短视频。
打赏20元即可获取本套教程的全部源码。
人生苦短,我用Python,我是您身边的Python私教~