这次给大家带来vue-router懒加载解决首次加载速度缓慢步骤详解，vue-router懒加载解决首次加载速度缓慢的注意事项有哪些，下面就是实战案例，一起来看一下。像vue这种单页面应用，如果没有应用懒加载，运用webpack打包后的文件将会异常的大，造成进入首页时，需要加载的内容过多，时间过长，会出啊先长时间的白屏，即使做了loading也是不利于用户体验，而运用懒加载则可以将页面进行划分，需要的时候加载页面，可以有效的分担首页所...
这次给大家带来vuex项目结构目录与配置使用详解，使用vuex项目结构目录与配置的注意事项有哪些，下面就是实战案例，一起来看一下。首先先正经的来一段官网的"忠告"：vuex需要遵守的规则：一、应用层级的状态应该集中到单个 store 对象中。二、提交 mutation 是更改状态的唯一方法，并且这个过程是同步的。三、异步逻辑都应该封装到 action 里面。文件目录结构文件之间的关系：store文件夹 - 存放vuex的系列文件store.js - 引入vuex...
这次给大家带来vue2.0实现注册登录步骤详解，vue2.0实现注册登录的注意事项有哪些，下面就是实战案例，一起来看一下。前言前段时间和公司一个由技术转产品的同事探讨他的职业道路，对我说了一句深以为然的话：“不要把自己禁锢在某一个领域，技术到产品的转变，首先就是思维上的转变。你一直做前端，数据的交互你只知道怎么进，却不知道里面是怎么出的，这就是局限性。”醍醐灌顶般，刚好学习vue的时候看到有个注册登录的项目，索性...
这次给大家带来code spliting优化Vue打包步骤详解，code spliting优化Vue打包的注意事项有哪些，下面就是实战案例，一起来看一下。在http1的时代，比较常见的一种性能优化就是合并http的请求数量，通常我们会把许多js代码合并在一起，但是如果一个js包体积特别大的话对于性能提升来说就有点矫枉过正了。而如果我们对所有的代码进行合理的拆分，将首屏和非首屏的代码进行剥离，将业务代码和基础库代码进行拆分，在需要某段代码的时候...
这次给大家带来vue-cli多模块打包使用详解，vue-cli多模块打包的注意事项有哪些，下面就是实战案例，一起来看一下。场景在实际的项目开发中会出现这样的场景，项目中需要多个模块（单页或者多页应用）配合使用的情况，而vue-cli默认只提供了单入口打包，所以就想到对vue-cli进行扩展实现首先得知道webpack是提供了多入口打包，那就可以从这里开始改造新建build/entry.jsconst path = require(path) const fs = require(fs) const m...
这次给大家带来vue实现微信授权登录步骤详解，vue实现微信授权登录的注意事项有哪些，下面就是实战案例，一起来看一下。背景vue前后端分离开发微信授权场景app将商品分享到微信朋友圈或者分享给微信好友，用户点击页面时进行微信授权登陆，获取用户信息。问题：没有固定的h5应用首页。授权后重定向url带参数并且很长本人愚钝，开发过程中，尝试过很多方法，踩坑不足以形容我的心情，可以说每一次都是一次跳井的体验啊。1.一开始是前...
这次给大家带来vue-cli 3.0.x 入门详解，vue-cli 3.0.x 使用的注意事项有哪些，下面就是实战案例，一起来看一下。最近项目正在优化。乘着有时间看了一下 vue-cli3.0.x 使用 。感觉还蛮不错的。 因为之前项目使用的 vue-cli 2 创建的，强行使用 eslint让我们很难受，一些与项目无关的 “build” 和 “config” ，让人看着就有一些不爽 。由于公司环境比较多，需要测试环境的配置。增加了 “”tt”: “node build/tt-build.js”” 。...
这次给大家带来vue select组件开启与禁用方法详解，vue select组件开启与禁用的注意事项有哪些，下面就是实战案例，一起来看一下。业务：消息推送方式有两种，为“微信”和“邮件”，微信发送时需要选择“要发送的应用程序”，邮件发送时不需要微信发送时，页面如下：邮件发送时，选择器不可用，页面如下：虽然官网上没有给出具体的例子，但可从属性中查到 “disabled”属性，属性说明类型默认值disabled是否禁用Booleanfalse实现：...
这次给大家带来使用Vue Mixin功能步骤详解，使用Vue Mixin功能的注意事项有哪些，下面就是实战案例，一起来看一下。转到用 Typescript 写 Vue 应用以后，经过一轮工具链和依赖的洗礼，总算蹒跚地能走起来了，不过有一个很常用的功能 mixin，似乎还没有官方的解决方案。既想享受 mixin 的灵活和方便，又想收获 ts 的类型系统带来的安全保障和开发时使用 IntelliSense 的顺滑体验。vuejs 官方组织里有一个 vue-class-component 以及连...
这次给大家带来vue iview动态路由与权限验证步骤详解，使用vue iview动态路由与权限验证的注意事项有哪些，下面就是实战案例，一起来看一下。github上关于vue动态添加路由的例子很多，本项目参考了部分项目后，在iview框架基础上完成了动态路由的动态添加和菜单刷新。为了帮助其他需要的朋友，现分享出实现逻辑，欢迎一起交流学习。Github地址iview-dynamicRouter实现目标客户端从服务端拿到路由和权限数据后，刷新项目的路由和菜单...
这次给大家带来Vue-cropper对图片进行裁剪步骤详解，Vue-cropper对图片进行裁剪的注意事项有哪些，下面就是实战案例，一起来看一下。一：裁剪的思路：1-1，裁剪区域：需要进行裁剪首先需要形成裁剪区域，裁剪区域的大小和我们的鼠标移动的距离相关联，鼠标移动有多远，裁剪区域就有多大。如下图：1-2 裁剪区域的宽和高的计算：如上图，鼠标的横向移动距离和纵向移动距离就形成了裁剪区域的宽和高。那么裁剪区域的宽和高的计算是：当...
vuex怎么使用？这次给大家带来vuex使用步骤详解（附代码），vuex使用的注意事项有哪些，下面就是实战案例，一起来看一下。什么是Vuex？vuex是一个专门为vue.js设计的集中式状态管理架构。状态？我把它理解为在data中的属性需要共享给其他vue组件使用的部分，就叫做状态。简单的说就是data中需要共用的属性。引入Vuex（前提是已经用Vue脚手架工具构建好项目）1、利用npm包管理工具，进行安装 vuex。在控制命令行中输入下边的命令就可...
这次给大家带来vue常用组件使用详解，vue常用组件使用的注意事项有哪些，下面就是实战案例，一起来看一下。项目技术：webpack + vue + element + axois (vue-resource) + less-loader+ ...vue的操作的方法案例：1.数组数据还未获取到，做出预加载的动画<el-carousel :interval="3000" type="card" height="200px" class="common-mt-md"><el-carousel-item v-for="item in movieArr" :key="item.id" class="text-center"><img v-bin...
这次给大家带来vuex使用详解，vuex使用的注意事项有哪些，下面就是实战案例，一起来看一下。1、 npm install vuex2、 在src 下 新建文件夹 store （为什么是这个单词，vuex 是用来状态管理的，用储存一些组件的状态，取存贮,仓库之意），store 文件下 新建文件 index.js (为什么是index.js？ 在导入的时候，会第一选择这个叫index的文件)3、 index.js import 导入 vue 和vuex (import 是es6 的语法， es5 是 require), 代码如下：...
这次给大家带来vuex里mapState,mapGetters使用详解，vuex里mapState,mapGetters使用的注意事项有哪些，下面就是实战案例，一起来看一下。一、介绍 vuex里面的四大金刚：State， Mutations，Actions，Getters（上次记得关于vuex笔记 http://www.gxlcms.com/article/138229.htm,是一个简单的应用；这是一些简单的vue的小组件方法： http://www.gxlcms.com/article/138230.htm）何为四大金刚？ 1.State （这里可以是 小写的 state，...