Vue3 + Pinia 仿抖音，Vue 在移动端的最佳实践 . Imitate TikTok ，Vue Best practices on Mobile
fd0d298f79
Bumps [vite](https://github.com/vitejs/vite/tree/HEAD/packages/vite) from 4.0.5 to 4.5.2. - [Release notes](https://github.com/vitejs/vite/releases) - [Changelog](https://github.com/vitejs/vite/blob/v4.5.2/packages/vite/CHANGELOG.md) - [Commits](https://github.com/vitejs/vite/commits/v4.5.2/packages/vite) --- updated-dependencies: - dependency-name: vite dependency-type: direct:development ... Signed-off-by: dependabot[bot] <support@github.com> |
||
|---|---|---|
| public | ||
| src | ||
| .gitignore | ||
| index.html | ||
| LICENSE | ||
| NOTE.md | ||
| package.json | ||
| pnpm-lock.yaml | ||
| README-en-US.md | ||
| README.md | ||
| vite.config.js | ||
简体中文 | English
预览
注意：电脑端请用Chrome浏览器的手机模式访问。Chrome切换成手机模式快捷键，先按F12调出控制台，再按Ctrl+Shift+M
注意：安卓手机请用Via手机浏览器或者Chrome浏览器手机版本预览。其他浏览器检测到页面内有视频会强制将视频全屏，并显示控制按钮，导致css和js都失效
简介
douyin 是一个模仿抖音的移动端短视频项目，它基于 Vue 3, Vite 实现。使用了最新的Vue全家桶技术栈，后台数据通过mock-js搭建
效果截图
功能点
| 页面 | 进度 |
|---|---|
| 首页 | 50% |
| -- 音乐 | ☑ |
| -- 抖音音乐榜 | ☑ |
| -- 搜索 | 50% |
| -- 直播 | 50% |
| 朋友 | 0% |
| 消息 | ☑ |
| -- 聊天 | ☑ |
| -- 各种通知 | ☑ |
| 我 | 90% |
| -- 求更新 | ☑ |
| -- 关注和粉丝 | ☑ |
| -- 编辑资料 | ☑ |
| -- 添加朋友 | ☑ |
| -- 我的音乐 | ☑ |
| -- 抖音商城 | 0 |
| -- 收藏视频\音乐 | ☑ |
| -- 右侧菜单子页面 | 10% |
| -- 设置 | ☑ |
| -- -- 具体设置页面 | 0% |
| 登录\注册 | ☑ |
运行
# 克隆项目到本地
git clone https://github.com/zyronon/douyin.git
# 进入项目目录
cd douyin
# 安装依赖
npm install
# 启动服务
npm run dev
# 访问
Chrome浏览器访问 http://localhost:5173
Chrome切换成手机模式快捷键，先按F12调出控制台，再按Ctrl+Shift+M
问题反馈
如果有任何问题、错误报告或功能请求，请随时提出Issues。
联系我
您可以联系我的邮箱 zyronon@163.com