前端开发

利用vue-router中的transition添加切换动画

vue-router中自带前端路由功能,但是切换起来比较的生硬,缺少一些美感,vue-router在设计之初也考虑到了这个问题,我们可以使用transition标签来给切换添加动画...
前端开发

使用vuex制作购物车

购物车是商城一类的网站的重要的一部分,因为涉及对多个数据的操作,逻辑也相对会复杂很多,使用jquery的情况下,逻辑会很复杂,很容易出错,但是使用vue进行搭建就会容易很多了。接下...
前端开发

使用vue搭建购物车(简单版)

购物车是商城一类的网站的重要的一部分,因为涉及对多个数据的操作,逻辑也相对会复杂很多,使用jquery的情况下,逻辑会很复杂,很容易出错,但是使用vue进行搭建就会容易很多了。接下...
前端开发

vuex的使用笔记

vuex作为vue的扩展,功能更加的强大,经过几天的摸索,我才逐步掌握,接下来给大家从头到尾详细分析一波: 首先我们安装vuex,我使用的是vue-cli脚手架工具进行配置使用: ...
前端开发

酷狗音乐实战(Vue-Cli)

1 Vue-Cli安装mint-ul插件 cnpm i mint-ui@1 -S 2 在route中的main.js中引入组件以及其样式 import MintUI from 'm...
黄瑞的博客

vue-cli(Vue-Router)组件级钩子函数

vue-cli(Vue-Router)组件级钩子函数 运行项目: [cc lang="javascript"]cnpm run dev[/cc] 打包项目: [cc lang="j...
黄瑞的博客

vue-cli(Vue-Router)全局钩子函数

vue-cli(Vue-Router)全局钩子函数,顾名思义,它作用域全局,只要路由发生了改变,那么,都会被执行。 一个是模仿登录,当用户访问到document路径的时候,跳转到登...
黄瑞的博客

vue-cli(Vue-Router)编程式导航

vue-cli(Vue-Router)编程式导航,借助浏览器自带的前进后退按钮,我们就可以实现页面的前进后退了,实现原理是当用户每点击一次,当前的路径就会被保存,返回就是跳转到上一...
黄瑞的博客

vue-cli(Vue-Router)动态设置name属性左右切换

vue-cli(Vue-Router)动态设置name属性左右切换 路由元信息 在路由配置中meta可以配置一些数据,用在路由信息对象中,访问meta中数据: $route.met...
黄瑞的博客

vue-cli(Vue-Router)导航切换过渡动画transition使用

在Vue-cli中,当我们点击不同的链接的时候,我们需要一个过渡动画,我们可以这样去实现 官方网址https://router.vuejs.org/zh/guide/advance...
黄瑞的博客

vue-cli(Vue-Router)query字符串传参

vue-cli(Vue-Router)query字符串传参 使用query参数,将使代码更加的简洁,query设置的就是?后面的值让人一目了然,接下来让我们了解一下吧! query...
黄瑞的博客

vue-cli(Vue-Router)监控$route路由信息对象

vue-cli(Vue-Router)监控$route路由信息对象 $route是vue-router带的一个对象,可以在函数中打印this.$route进行查看,通过监控路由的变...
黄瑞的博客

vue-cli(Vue-Router)动态路径参数

每一个页面就是一个路由,假如有1000个用户,岂不是又1000个页面,但是显示的内容其实差别都是不大的,那么我们怎么实现复用了,这个时候,我们就可以用到Vue-Router中的动态...
黄瑞的博客

vue-cli(Vue-Router)滚动行为

浏览器滚动到下面去了之后,我们刷新浏览器,会发现滚动条依然在那里,这是浏览器的默认行为,在vue-router中,这样会有问题,那么我们就来解决这个问题: 方法一(通过scroll...
黄瑞的博客

vue-cli(Vue-Router)命名视图

二级路由path添加"/"表示的就是缩短路由 添加前: /about/study 添加后: /study [cc lang="javascript"] { path: '/abou...
黄瑞的博客

vue-cli(Vue-Router)嵌套路由的使用

Vue Router 是 Vue.js 官方的路由管理器。它和 Vue.js 的核心深度集成,让构建单页面应用变得易如反掌。包含的功能有: 嵌套的路由/视图表 模块化的、基于组件的...
黄瑞的博客

Vue-cli(Vue-router)中的重定向和别名

当访问错误路径时,提示404 404.vue中的内容 [cc lang="javascript"] 404,您访问的页面不存在!!! [/cc] route文件夹下index.js...