Vue---day05】的更多相关文章

1.案例:名字合并(监听data数据的改变) 使用keyup事件监听data数据的改变 <!DOCTYPE html> <html> <head> <title>案例:名字合并</title> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0&qu…
紧急更新第二弹,然后就剩下最后一弹,也就是整个前台的项目 一.购物车 1.加入购物车(新知识点) 加入到购物车是需要接口操作的,因为我们需要将用户的加入到购物车的保存到服务器数据库,你的账号后面才会在你自己的购物车看到,所以这里要先写接口 然后vuex三部曲, 返回来的数据没有data,就是告诉你成功了,存近数据库了所以确实也不需要什么data,所以这里vuex三部曲,只需要到actions这一步就可以了 成功与失败的判定: 之前在actions里面的操作都是async加await的操作,他们的…
前台部分到此结束,一路走来还挺怀念,今天主要是对整个项目的完成做一个最后的收尾工作,对于功能上的需求没有什么了,主要就是项目上线的一些注意事项. 一.个人中心二级路由 当我们点击查看订单应该跳转到个人中心 个人中心拆分两个子路由组件 分好组件后,在routes里面父组件写上childre配置项 写路由不需要写/了,写跳转路由需要写全地址 路由重定向 二.我的订单 获取订单列表详情,保存数据 注意这里的布局是采用的table,里面每一个订单为一个table 一个订单里面可一次性买多个东西吧,所以一…
今天继续是对后台管理部分的一个操作,但是快要结束了,今天结束,明天会进入一个从Vue以来,另外一个名声显著的东西了,一只耳闻从未见识,而且十分的炫酷 他就是------数据可视化Echarts,迫不及待了解了 11.销售属性添加 当我们点击添加就,应该把添加的放到table里面来,table里面每一行数据是一个对象 然后就可以开始整理数据,我们select收集的值不应该只是id 收集到了数据,直接在button点击事件,整理参数,给到我们的data对应的数据 12.销售属性值展示与收集 这里主要…
什么是webpack webpack 是前端的一个项目构建工具, 它是基于 Node.js 开发出来的一个前端工具 借助于webpack这个前端自动化构建工具, 可以完美实现资源的合并.打包.压缩.混淆等诸多功能 webpack安装的两种方式 $ npm install webpack -g 全局安装 $ npm install webpack --save-dev 下载开发版本 $ npm install wabpack@3.8.1 下载指定版本 使用webpack 打包构建隔行变色案例 运行…
vue_shop 目录 vue_shop day01 实现登录功能 项目预开发处理 Login.vue完整代码: 处理步骤: 添加element-ui的表单组件 添加第三方字体: 添加表单验证 导入axios 配置弹窗提示: 登录成功操作: 添加路由守卫 实现退出功能 补充 day02 后台首页基本布局 顶部与侧边栏布局 axios请求拦截器 侧边栏数据 设置激活子菜单样式 侧边菜单栏的伸缩功能 Welcome.vue 完整home.vue代码 用户列表 用户列表基本结构 请求用户列表数据 展示…
MVVM 是Model-View-ViewModel 的缩写,它是一种基于前端开发的架构模式,其核心是提供对View 和 ViewModel 的双向数据绑定,这使得ViewModel 的状态改变可以自动传递给 View,即所谓的数据双向绑定. Vue.js 是一个提供了 MVVM 风格的双向数据绑定的 Javascript 库,专注于View 层.它的核心是 MVVM 中的 VM,也就是 ViewModel. ViewModel负责连接 View 和 Model,保证视图和数据的一致性,这种轻量…
十一.安装sass文件转换为css需要的相关依赖包 npm install --save-dev sass-loader style-loader css-loader loader的作用是辅助webpack将符合条件的源文件转换为对应的目标格式文件.比如index.scss转换成index.css 安装成功后,package.json文件变化如下: 接着,安装extract-text-webpack-plugin,让webpack可以输出css格式的文件 npm install --save-…
六.新建webpack配置文件 webpack.config.js 文件整体框架内容如下,后续会详细说明每个配置项的配置 webpack.config.js直接放在项目demo目录下 module.exports = { // 配置入口 entry: { }, // 编译后的文件路径 output: { path: '', // 文件路径 filename: '' // 文件名称 }, module: { // 编译规则 loaders: [] }, // 辅助的插件 plugins:[] }…
一.安装node.js node.js是基础,必须先安装.而且最新版的node.js,已经集成了npm. 下载地址 node安装,一路按默认即可. 二.全局安装webpack npm install -g webpack 如果公司网络是设置代理的,要设置下代理地址 npm config set proxy http://***/ 三.建立项目文件夹 我在本机的E盘上,建了一个名称为demo的文件夹 四.初始化package.json 1.cmd控制台进入E盘下的demo文件夹 2.输入 npm…