同步操作将从 废柴阿蔚/heima 强制同步,此操作会覆盖自 Fork 仓库以来所做的任何修改,且无法恢复!!!
确定后同步将在后台操作,完成时将刷新页面,请耐心等待。
A Vue.js project to learn vue
# install dependencies
npm install
# serve with hot reload at localhost:8080
npm run dev
# build for production with minification
npm run build
# build for production and view the bundle analyzer report
npm run build --report
For a detailed explanation on how things work, check out the guide and docs for vue-loader.
(另外由于接口问题,很多图片都挂了,见谅)
MUI的图标在example文件夹中找,火狐对本地HTML支持不好,使用edge或Chrome打开
需要拷贝扩展图标的样式库与字体库。
为购物车图标添加类名。 mui-icon mui-icon-extra mui-icon-extra-cart
###设置路由高亮
linkActiveClass: 'mui-active'
###点击路由展示组件
用的图片接口是必应公开接口 Swiper组件使用,踩了坑
轮播图API地址(原地址已经失效,使用公开的bing每日图片的api)
使用axios加proxytable代理(踩坑)
遇到奇怪的bug 修改了proxyTable 的配置后,跨域还是不成功,最后删了node_modules重新下载了一次,解决了
##切换组件的动画
moment.js 1.npm install moment.js
删掉依赖后重新 npm i 后报错
(解决)
####绘制新闻资讯界面, 使用 MUI 中的 media-list.html
##三:图片分享
滑动的时候报警告:Unable to preventDefault inside passive event listener due to target being treated as passive. See https://www.chromestatus.com/features/5093566007214080
解决方法,可以加上* { touch-action: none; } 这句样式去掉。
原因:(是chrome为了提高页面的滑动流畅度而新折腾出来的一个东西) http://www.cnblogs.com/pearl07/p/6589114.html https://developer.mozilla.org/zh-CN/docs/Web/CSS/touch-action
vue-preview插件使用的坑
scoped 属性的影响,导致该组件的样式无法设置
##四:商品购买
####商品详情
卡片视图 使用 mui 的mui-card
轮播图 swiper
商品购买 自建一个numbox 组件 初始化
商品参数 问题:路由跳转后,滚动条记录 解决 :
购物车
购物车小球动画 getBoundingClientRec()方法获取位置 ####JavaScript中getBoundingClientRect()方法详解
当商品数量改变时实时接收购买数量 (子传父) 细节:传值转化为数字
根据父组件中的商品存储量改变数字选择框最大值(父传子) mui 自带API
###vuex的使用
此处可能存在不合适展示的内容,页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容,可点击提交进行申诉,我们将尽快为您处理。