vue组件组件分为三部分…

目录: 1.组件传值-父组件向子组件传值和data与props的区别    2.组件传值-子组件通过事件调用向父组件传值          3.案例:发表评论.使用ref获取DOM元素和组件引用    4.路由-前端路由和后端路由的概念    5.路由-vue-router的基本使用    6.路由-路由redirect重定向的使用    7.路由-设置选中路由高亮的两种方式    8.路由-为路由切换启动动画    9.路由传参-使用query方式传递参数    10.路由传参-使用param…

什么是路由 后端路由: 对于普通的网站,所有的超链接都是URL地址,所有的URL地址都对应服务器的资源: 前端路由: 对于单页面应用程序来说,主要是通过URL中的hash(#)来实现不同页面之间的跳转,同时,hash有一个特点:HTTP请求中不会包含hash相关的内容:所以,单页面程序中的页面跳转主要用hash实现: 在点页面应用程序中,这种通过hash改变来切换页面的方式,称作前端路由(区别于后端路由): 在 Vue 中使用 vue-router 导入 vue-router 组件类库 <scr…

这几天一直都在做项目,只是没有上传上来,即将把前台项目完结了.现在开始更新整个前台的部分 一.面包屑处理 1.分类操作 点击三级联动进入搜索产生面包屑,直接取参数中的name即可 点击x怎么干掉这个面包屑,直接让其v-if为这个name,如果点击x就把name清空 清空还没完,清空应该再发一次请求,然后将我们里面的残留的id清空,回到默认页面 但其实这里还有点小问题,我们是吧id清空了发了个请求,但其实既然没有id,可以把他的制改为undefined,这样直接发过去的请求就不带id这些参数了,这…

昨天太晚就没来得及更新,今天是spu管理界面,这个界面一共有三个界面需要切换,完成了两个界面,而且今天的难度在于最后两个章节,富有一定的逻辑性,当然中间也有很多需要注意的,比如ElementUI的照片墙需要添加list属性而且值为你的数据并且必须是一个数组必须有name.url属性 一.spu管理 1.按钮与三级联动可操作性 当进入属性的添加这个界面我们的三级联动应该不可点击 以及我们没有添加属性值不应该能够点击保存 2.spu介绍 spu和sku就是类与实例的关系 添加 修改 等等 3.静态…

1. 脚手架:  如何:   1. 安装脚手架的工具命令:      npm i -g @vue/cli   电脑安装完命令后  :  直接创建  vue create 文件夹名字   2. 用命令反复创建脚手架:     cd 要保存项目的文件夹完整路径 比如: cd C:\xampp\htdocs\dd\6_VUE\day04     用vue命令工具,创建一个项目的脚手架代码     1. Your connection to the default npm registry seems…

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:[] }…