1 Star 0 Fork 0

ITZTao / myVUEprject

加入 Gitee
与超过 1200万 开发者一起发现、参与优秀开源项目,私有仓库也完全免费 :)
免费加入
克隆/下载
README.md 2.13 KB
一键复制 编辑 原始数据 按行查看 历史
zTao 提交于 2019-04-15 20:23 . my one prject

#我的第一个vue项目

##项目 制作 过程

app.vue--区域 1,header ----使用(mint-ui)

2,底部----(MUI) --tabbar

##小图标---(MUI) 导入:1,icons-extra.css ---扩展图标css样式 2,mui-icons-extra.ttf ---扩展字体库

###把 底部 导航改造 为 router-link

创建 四个 组件 (设置路由)

homeContainer.vue
contactContainer.vue
shopCarContainer.vue
gearContainer.vue

###轮播图

MUI---九宫格布局

新闻列表 路由 链接

新闻 界面

使用 过滤器 过滤时间

进入 新闻 详情 页

添加 公共 子组件 评论 组件

图片 分享 组件

 ########################导入 mui.min.js 的错误 修改》》》》》》》》》》》

注意:mui 不能直接这样用 会报错 import '../../lib/MUI/js/mui.min.js';

mui('.mui-scroll-wrapper').scroll({ deceleration: 0.0005 //flick 减速系数,系数越大,滚动速度越慢,滚动距离越小,默认值0.0006 });

报错项:
  Uncaught TypeError: 'caller', 'callee', and 'arguments' properties may not be accessed on strict mode functions or the arguments objects for calls to them

原因:webpack 打包的 bundle.js 默认使用了严格模式 而 'caller', 'callee', and 'arguments' 这三个在严格模式下 是不允许被使用的 所以 需要 删除 bundle.js 的 严格模式、

     1  下载安装包$ npm install babel-plugin-transform-remove-strict-mode
     2, .babelrc 文件添加配置
     {
      "plugins": ["transform-remove-strict-mode"]
     } 


1,添加: touch-action: pan-y;  ----解决滑动警告  


2,刚进入 相片 页 滑动条 无法 使用----此时需要 把初始化 滑动条放到钩子函数 mounted()
   因为,他需要 操作 dom 因为 操作 dom 只有在  mounted() ---里面才能操作


3,此时--底部导航条 无法切换  因为 App.vue 中的 mui-tab-item 类名 冲突
   所以 吧 相关 代码 复制 修改 类名

###图片 列表 加载

图片 详情 页面

购物 车

1
https://gitee.com/ITATao/myVUEprject.git
git@gitee.com:ITATao/myVUEprject.git
ITATao
myVUEprject
myVUEprject
master

搜索帮助