uni-app高分开源电影项目源码案例分析，支持一套代码发布小程序、APP平台多个平台(前端入门必看)
<h1 id="uni-app-video">uni-app-Video</h1><blockquote>
<p>GitHub地址：https://github.com/Tzlibai/uni-app-video</p>
</blockquote>
<blockquote>
<p>一个优秀的uni-app案例，旨在帮助大家更快的上手uni-app，共同进步！</p>
</blockquote>
<h2 id="features">Features</h2>
<p></p>
<ul>
<li>代码编写简洁，注释清晰，快速入门必备；</li>
<li>支持在线模糊搜索；</li>
<li>程序类目懒加载，支持在线播放预告片；</li>
<li>更好的App跨平台框架、更方便的H5开发框架，加载新页面速度更快；</li>
<li>一套代码，可发布到iOS、Android、H5、以及各种小程序（微信/支付宝/百度/头条/QQ/钉钉/淘宝）、快应用等多个平台。</li>
</ul>
<h2 id="扫码体验">扫码体验</h2>
<p><img src="http://www.zhaohongcheng.com:8100/github/ma.jpg" alt="H5" loading="lazy"></p>
<h3 id="启动准备">启动准备</h3>
<p> 小程序账号及微信开发者工具： https://mp.weixin.qq.com</p>
<p> 建议编辑器：HBuilderX</p>
<h3 id="手摸手启动项目--以小程序为例-">手摸手启动项目 ( 以小程序为例 )：</h3>
<p>1.打开 <strong>HBuilderX</strong>导入项目：</p>
<p><img src="http://www.zhaohongcheng.com:8100/github/improt.png" alt="H5" loading="lazy"></p>
<p>2.进入<strong>manifest.json</strong>文件中修改成自己的相关ID（如遇无法加载配置文件，重启编辑器即可）；</p>
<p><img src="http://www.zhaohongcheng.com:8100/github/main.png" alt="H5" loading="lazy"></p>
<p>接下来就可以正常使用啦~</p>
<h4 id="小程序启动可能会遇到问题">小程序启动可能会遇到问题：</h4>
<ul>
<li>
<p><strong>HBuilderX报错：微信开发者工具拒绝HBuilderX访问端口</strong></p>
<p>答：微信开发者工具 -- 设置 -- 安全设置，点击开启服务端口即可解决。</p>
</li>
<li>
<p><strong>小程序报错：不在以下 request 合法域名列表中</strong></p>
<p>答：这是因为在小程序中发起了wx.request请求,但是请求的域名没有在微信公众平台后台设置，管理员将需要使用的域名添加到小程序后台，（调试时可以点击微信开发者工具右上角 **详情 -- 本地设置 -- 勾选不校验合法域名 **,可暂时取消报错）。</p>
</li>
<li>
<p><strong>小程序报错：Failed to load media http://xxx.xx server responded with a status of 403</strong></p>
<p>答：这是小程序电影详情页面的预告片视频报错（不影响可忽略此错误），并不是加载视频错误，而是微信开发者工具中加载视频会提示这个错误，所以在调试带有视频的控件时，可以点击真机预览小程序。</p>
</li>
</ul>
<hr>
<h2 id="项目结构">项目结构</h2>
<p>.<br>
├─ colorui/ # 引入的UI文件<br>
├─ components/ # uni-app组件目录<br>
│├─ comp-a.vue # 可复用的a组件<br>
├─ pages/ # 业务页面文件存放的目录<br>
│├─ home/<br>
││├─ index.vue # home页面<br>
│├─ detail/<br>
││├─ index.vue # detail页面<br>
├─ static # 存放应用引用静态资源（如图片、视频等）的目录，注意：静态资源只能存放于此<br>
├─ unpackage/ # 打包目录<br>
├─ App.vue #应用配置，用来配置App全局样式以及监听<br>
├─ main.js # Vue初始化入口文件<br>
├─ manifest.json # 配置应用名称、appid、logo、版本等打包信息<br>
├─ package.json # 配置页面路由、导航条、选项卡等页面类信息</p>
<h3 id="复制代码tips">复制代码Tips:</h3>
<p>static 目录下的 js 文件不会被编译，如果里面有 es6 的代码，不经过转换直接运行，在手机设备上会报错。<br>
css、less/scss 等资源同样不要放在 static 目录下，建议这些公用的资源放在 common 目录下。</p><br><br>
来源：https://www.cnblogs.com/zhaohongcheng/p/12896337.html
頁:
[1]