20-Vue实战项目：电商管理系统（Element-UI）总结

20-Vue实战项目：电商管理系统（Element-UI）总结

结果如下：

这算是我自己跟着视频做的第一个比较完整的可以看的项目了，用时18天，但这视频的总时间是20个小时，自己还是比较的低效率。不多说看看着里面到底是有一些啥东西吧

需要预备的知识：

1. html，css，javascript 只要看过几眼都可以，用的不多不复杂
2. vue2 基础知识 ，v-if v-for之类
3. 啥都不会也可以跟着视频做的去，不知道的百度一下就可以

在这里面用到的东西:

1. element UI 主要就是对于这个前端组件库的使用
2. icon-font 字体图标也会用到
3. ECharts

做完这个vue的东西，主要学到的内容：

学会了使用git的一些简单的操作，把自己的代码提交到了云端 https://github.com/Aoyia/vue-store git status git branch //查看分支 git branch login //新建分支 git checkout master //切换分支 git merge login // 合并分支 git push //推送本地的代码到云端中 // 把本地的分支推送推送到云端进行保存 git checkout login git push -u origin login 熟悉了vue的简单的做界面的流程， 对element UI 的使用变得熟悉，里面的现成的东西非常之多，网页上看得到的东西里面基本有，各种属性用起来真的方便 初步的学会使用axios 学会了简单的组件调用函数的实现 过滤器的使用，Vue.js 允许你自定义过滤器，可被用于一些常见的文本格式化 <template slot-scope="scope"> { { scope.row.add_time | dateFormat }} </template> Vue.filter(dateFormat, function(originVal) { const dt = new Date(originVal); const y = dt.getFullYear(); const m = (dt.getMonth() + 1 + ).padStart(2, 0); const d = (dt.getDate() + ).padStart(2, 0); const hh = (dt.getHours() + ).padStart(2, 0); const mm = (dt.getMinutes() + ).padStart(2, 0); const ss = (dt.getSeconds() + ).padStart(2, 0); return `${y}-${m}-${d} ${hh}:${mm}:${ss}`; }); 路由的设置

基本上也就这样些东西，对于我这种新手来说。这感觉还是不错的，简单易上手，不用复杂的一些传递参数的操作，做完后感觉vue没那么不亲切了，别人的代码也可以看上几眼。不过这视频https://www.bilibili.com/video/BV1EE411B7SU?from=search&seid=238269181249223393 好像是说并没有vue的组件的运用，全程都是在调用element UI的组件，而且到了后面基本上都是一模一样的代码，复制粘贴改一下参数就用，弹幕说全是冗余代码。后面得去看看codewhy老师的vue视频。有兴趣的还是可以做一下的，视频的后面部分很多重复个人觉得没必要做一些已经做过的。有兴趣的同学私我发老师的资料给你