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

结果如下：

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

需要预备的知识：

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

在这里面用到的东西:

element UI 主要就是对于这个前端组件库的使用
icon-font 字体图标也会用到
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视频。有兴趣的还是可以做一下的，视频的后面部分很多重复个人觉得没必要做一些已经做过的。有兴趣的同学私我发老师的资料给你

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

vue实战项目-电商商城前台-（学习尚硅谷的）尚品汇
文章目录最好使用视频上的账号密码,13700000000 密:111111 最新服务端接口地址:http://gmall-h5-api.atguigu.cn 脚手架使用 1.创建项目 2.脚手架默认 ...
【Vue 实战项目】后台管理系统登录页详解附源码
提示:前端查漏补缺,仅代表个人观点. 文章目录一.先看效果图二.实战步骤 1. 创建项目 2. 引入库 3. 登录页关键代码三.页面源代码总结提示:项目源代码除了登录页面还有动态路由一.先 ...
基于Hadoop开发的大数据实战项目——电商日志分享系统
项目介绍大数据电商日志平台项目以某电商网站真实的业务数据架构为基础,将数据从收集到使用通过前端应用程序,后端程序,数据分析,平台部署等多方位的闭环的业务实现.形成了一套符合教学体系的电商日志分析项目 ...
基于Vue和SpringBoot的电商管理系统的设计与实现
作者主页:Designer 小郑作者简介:Java全栈软件工程师一枚,来自浙江宁波,负责开发管理公司OA项目,专注软件前后端开发(Vue.SpringBoot和微信小程序).系统定制.远程技术指导. ...
vue实战项目：电商管理系统实现步骤笔记(一)
vue实战项目视频地址以及项目文件一.项目概述 1.1电商项目基本业务概述 1.2电商后台管理系统的功能 1.3电商后台管理系统的开发模式(前后端分离) 1.4电商后台管理系统的技术选型 1.4. ...
Vue实战项，基于Element-UI 电商管理系统源代码，含项目部署指南
电商项目基本业务概述根据不同的应用场景,电商系统一般都提供了 PC 端.移动 APP.移动 Web.微信小程序等多种终端访问方式,我们主要是实现PC后台管理系统. 1.2 电商后台管理系统的功能电 ...
前端开发Vue项目实战：电商后台管理系统（一）前后端搭建
目录 1. 项目概述 2. 前端项目初始化步骤 3. 后台项目的环境安装配置下载安装phpStudy,添加数据库 Postman测试工具验证 1. 项目概述电商项目基本业务概述: 根据不同的应用 ...
前端学习（1886）vue之电商管理系统电商系统之首页路由的重定向主页侧边栏路由链接的改造
目录结构 router.js import Vue from 'vue' import Router from 'vue-router' import Login from './components ...
前端学习（1885）vue之电商管理系统电商系统之首页路由的重定向
目录结构 router.js import Vue from 'vue' import Router from 'vue-router' import Login from './components ...

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

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

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

最新文章

热门文章