# 苹果模仿 **Repository Path**: Wananme/apple-imitation ## Basic Information - **Project Name**: 苹果模仿 - **Description**: 对苹果的初级模仿，基本实现交互式，后续可能会写一点后端内容 技术栈：vue框架，vue全家桶，js, - **Primary Language**: Unknown - **License**: AGPL-3.0 - **Default Branch**: master - **Homepage**: None - **GVP Project**: No ## Statistics - **Stars**: 0 - **Forks**: 1 - **Created**: 2024-10-05 - **Last Updated**: 2024-10-05 ## Categories & Tags **Categories**: Uncategorized **Tags**: None ## README <<<<<<< HEAD # 项目简介 这是用vue写的一个模仿最新的苹果官网的项目 项目完成了苹果官网首页的还原，并对个别产品进行了详细的介绍。 没有使用任何第三方组件库，组件全部都是自己纯手写。 其中还原了airpods pro产品的详细介绍，具有极强的交互式体验，用了大量的js原生操作dom的方法。 响应式布局，兼容移动端和pc端。 技术栈：vue-cli、vue、vue-router 静态资源(图片)来源:苹果中国官网 后面的交互式是我个人独自写的，写的有点烂 前面的一些静态页面的来源是模仿这位兄台的：https://gitee.com/donggushi/vueforappleofficialsite 项目展示： 项目中如有不妥的地方，请联系qq：2802241578. 欢迎交流指正哈。。。嘿嘿 #项目展示 ![输入图片说明](https://images.gitee.com/uploads/images/2020/0703/171831_f69c2309_7770774.png "B69BB503-BC06-4108-AE10-B09C983C096E.png") ![输入图片说明](https://images.gitee.com/uploads/images/2020/0703/172019_b6b96db2_7770774.png "QQ20200703-172009@2x.png") ![输入图片说明](https://images.gitee.com/uploads/images/2020/0703/172135_92410f99_7770774.png "QQ20200703-172124@2x.png") airpods pro产品的详细介绍中，能够鼠标滑动，滑动到不同的位置，显示不同的动画和文字说明。 ![响应式布局，能够兼容移动端和pc端](https://images.gitee.com/uploads/images/2020/0703/172504_dc66e5e8_7770774.png "QQ20200703-172403@2x.png") 具体路径：http://localhost:8080/cn/shop/goto/product/MV7N2 点击浏览全部：会出现一个下拉框，里面展示一些具体内容，再次点击则消失 ![img](https://gitee.com/baoihd/apple-imitation/raw/master/static/frist.png) 点击免费个性化服务-----第一个板块展示： ![img](https://gitee.com/baoihd/apple-imitation/raw/master/static/second.png) 输入框下面是一个轮播图，可以点击小圆圈进行滚动展示。 点击轮播图里面的具体信息之后输入框会显示你点击的图案，然后输入框里面的文字内容会动态展示 点击保存之后，输入框里面的内容会展示在首页上面 如果输入有内容，点击关闭按钮，内容不会消失，再次触发此模块之前的内容会重新出现 点击App三里屯： 会出现省份选择,点击你选择的省份之后，高度会发生变化（根据地区的多少来进行变化，）如果省份之后只有区，再次点击之后页面会进行刷新，然后会保存你点击的位置，点击关闭按钮再次打开则会展示你上次编辑的样式 之后的内容还在编写中----------- ![img](https://gitee.com/baoihd/apple-imitation/raw/master/static/%E7%AC%AC%E4%B8%89%E4%B8%AA.png) # 启动项目 cd到项目根目录然后输入如下指令 npm run dev #打包 cd到项目根目录然后输入如下指令 npm run build ======= # 用vue写的仿苹果官网项目 #### 介绍 这是用vue写的一个模仿最新的苹果官网的项目，截止时间为2020年7月2日。 项目完成了苹果官网首页的还原，并对个别产品进行了详细的介绍。 没有使用任何第三方组件库，组件全部都是自己纯手写。 其中还原了airpods pro产品的详细介绍，具有极强的交互式体验，用了大量的js原生操作dom的方法。 响应式布局，兼容移动端和pc端。 技术栈：vue-cli、vue、vue-router 静态资源(图片)来源:苹果中国官网 #### 软件架构 软件架构说明 #### 使用说明 cd到项目根目录 启动项目： 1. npm run dev 打包项目： 2. npm run build #### 参与贡献 1. Fork 本仓库 2. 新建 Feat_xxx 分支 3. 提交代码 4. 新建 Pull Request #### 码云特技 1. 使用 Readme\_XXX.md 来支持不同的语言，例如 Readme\_en.md, Readme\_zh.md 2. 码云官方博客 [blog.gitee.com](https://blog.gitee.com) 3. 你可以 [https://gitee.com/explore](https://gitee.com/explore) 这个地址来了解码云上的优秀开源项目 4. [GVP](https://gitee.com/gvp) 全称是码云最有价值开源项目，是码云综合评定出的优秀开源项目 5. 码云官方提供的使用手册 [https://gitee.com/help](https://gitee.com/help) 6. 码云封面人物是一档用来展示码云会员风采的栏目 [https://gitee.com/gitee-stars/](https://gitee.com/gitee-stars/) >>>>>>> 9275fc66480fbdad077307a813b03a0fa6189424