![](https://img-blog.csdnimg.cn/20201014180756925.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
vue学习
路途芬芳
这个作者很懒,什么都没留下…
展开
-
Vue-cli4打包踩坑
最近在做一个vue项目,后台还没有开始,只是根据提供的原型ui把前台静态页面设计出来,也是本人第一次做,开始做的时候用的是cli-4.x版本,给我的感觉,简化了很多,目录结构很简洁。然而在打包准备上线测试的时候遇到了很多问题,以此记录下来,希望我的文章能够帮到有需要的童鞋。大神轻喷。一、初始打包命令npm run build默认编译后直接在根目录生成dist文件夹在没有编写vue.co...原创 2020-03-29 15:14:12 · 7713 阅读 · 2 评论 -
Vue——keep-alive和记忆之前的状态
一、keep-alive能够让组件不再频繁地创建频繁地销毁,能够提高性能二、keep-alive使用在App.vue中用该标签包含主 <keep-alive> <router-view></router-view> </keep-alive>keep-alive包含两个重要的属性include和exclude...原创 2020-03-19 17:53:42 · 247 阅读 · 0 评论 -
Vue——路由懒加载
什么是懒加载当打包构建应用时,JavaScript 包会变得非常大,影响页面加载。如果我们能把不同路由对应的组件分割成不同的代码块,然后当路由被访问的时候才加载对应组件,这样就更加高效了。使用懒加载以下代码是常规加载方式// index.js// 配置路由相关信息import VueRouter from 'vue-router'import Vue from 'vue'im...原创 2020-03-19 17:51:05 · 139 阅读 · 0 评论 -
Vue——导航守卫
一、为什么使用导航守卫在一个SPA应用中,网页改变,他的标题也需要改变,网页标题是通过来显示的,但是SPA只有一个固定的HTML,切换不同的页面时,标题并不会改变,所以我们需要用导航守卫进行修改.守卫包括:全局守卫、路由独享守卫、组件内的守卫二、如何修改1、在index.js中写 router.beforeEach()函数,它需要我们给他一个箭头函数,箭头函数包含有to, from, ne...原创 2020-03-19 17:49:34 · 157 阅读 · 0 评论 -
Vue-router使用及其嵌套
一、vue-router使用步骤第一步:创建路由组件新建两个组件第二步:配置路由映射:组件和路径映射关系index.js// 配置路由相关信息import VueRouter from 'vue-router'import Vue from 'vue'// 引入组件的路径import Home from '../components/Home'import A...原创 2020-03-19 17:37:34 · 485 阅读 · 0 评论 -
Vue——脚手架安装
脚手架安装截止本文,脚手架最新版本为4.2.2全局安装脚手架命令:npm install -g @vue/cli兼用2.x版本命令:npm install @vue/cli-init -g初始化项目命令Vue CLI2初始化项目: vue init webpack my-projectVue CLI3初始化项目:vue create my-projec...原创 2020-03-19 17:25:32 · 131 阅读 · 0 评论 -
Vue——页面重定向
重定向场景一比如登录后所显示的页面一般是主页部分,这个主页则是我们重定向的页面直接上代码:// router/index.jsimport Vue from 'vue'import VueRouter from 'vue-router'const Home = () => import("../components/Home")const Login = () =>...原创 2020-03-19 17:18:48 · 24367 阅读 · 4 评论 -
图解Vue生命周期
原创 2020-02-14 12:14:56 · 92 阅读 · 0 评论