在使用vux开发手机页面时，引入vux的公共样式less一直报错，通过各种百度，Google都没有解决，走了很多弯路。最后才发现钻牛角尖了，可以换一种方法引入。 1、报错的使用：在App中 @ ./~/css-loader?{"minimize":false,"sourceMap":false}!./~/vux/src/styles/reset. less 3:10-115@ ./~/css-loader?{"minimize":false,"sourceMap":false}!./~/vue-loader/lib/style- compiler?{"id":"data-v-942b00fc","scoped":false,"hasInlineC...
在学习一位vue大牛的课程《VUE2.0移动端音乐App开发》时，由于vue的版本原因遇到了一些问题 这是其中之一，花费了很多的时间去解决 虽然搞定了这个问题，但是很多东西理解也不是很到位，下面详细说： 系统windows，vue版本2.9.1 项目结构如下：这里就知道版本差异了，我没有dev-server这个文件，按照黄大牛的配置会报404的错误，错误具体我就不贴了 直接上解决办法 首先在config目录下配置index.js文件如下然后在webpack.dev.conf中...
当前后端分离时，权限问题的处理也和我们传统的处理方式有一点差异。笔者前几天刚好在负责一个项目的权限管理模块，现在权限管理模块已经做完了，我想通过5-6篇文章，来介绍一下项目中遇到的问题以及我的解决方案，希望这个系列能够给小伙伴一些帮助。本系列文章并不是手把手的教程，主要介绍了核心思路并讲解了核心代码，完整的代码小伙伴们可以在GitHub上star并clone下来研究。另外，原本计划把项目跑起来放到网上供小伙伴们查看...
原因 今天在使用element-ui时，el-input组件监听不了回车事件，如下代码没有想要的效果： <el-input class="search-input" placeholder="请输入内容" v-model="searchText" @keyup.enter="search()"></el-input> 原因应该是element-ui自身封装了一层input标签之后影响了事件的监听，在element-ui里有很多因为自身封装了几层标签导致事件和样式无法按想要的效果呈现，遇到后可以在网页中查看dom结构分析原因。 解决 在事件后面加上....
现象 加载第一个组件（这里的第一个意思是浏览器历史记录的第一个，后文称为 待监听组件 ）时，正常跳转其他页面可以触发beforeRouteLeave。 但是 按浏览器的后退按钮监听不到该事件。 解决方案 目前采用比较土且不实用的解决方案。加一层组件，再router.push到 待监听组件 ，使得 待监听组件 非第一个组件，可以正常监听beforeRouteLeave事件。 注意点： 由于打乱了原来的路由。需要在main.js中添加全局的路由监听router.beforeEa...
之前在公司做项目，一直感觉用ref来定位dom节点挺方便的。但是期间遇到了一个问题，就是在mounted(){}钩子里面使用this.$refs.xxx，打印出来的却是undefined？ 于是我就对比了一下之前使用ref定位的.vue文件，发现了他们之间的区别。 我们要想知道为什么会定位不到某个DOM节点，我们首先要理解mounted(){}这个钩子函数是用来做什么的。 下面是vue官方给出的vue生命周期（部分），正如官方所说的一样，一开始不必先理解，不过随这你...
//由于windows系统的某方面问题，vue脚手架安装可能会出现第一证书丢失 // 报错：vue-cli Failed to download repo vuejs-templates/webpack-simple: unable to verify the first certificate //简单一点，你也可以直接去github下载对应的模板(template), 然后windows+r,cmd, vue init webpack-simple project --offline//project是项目名称 //在https://github.com/vuejs-templates/下载（看不懂英文直接点Clone or Download 里的...
先说结论 在自定义验证里面每一个判断都要有callback(),就是要保证callback()一定会执行到 因为要验证数字，参考了官网参考代码如下，发现有如下图bug，当输入为以数字开头包含字符串的内容时，验证不会报错，因为业务逻辑也不相符，随改写代码 <el-form-item label="年龄" prop="age"><el-input v-model.number="ruleForm2.age"></el-input></el-form-item> var checkAge = (rule, value, callback) => {if (!value) {return call...
当我们在django web框架中,使用vue的时候,会遇到语法冲突. 因为vue使用{{}},而django也使用{{}},因此会冲突. 解决办法1: 在django1.5以后,加入了标签: {% verbatim myblock %} {% endverbatim myblock %}被此标签包裹的代码将不会被Django的模板引擎渲染。 因此,我们可以把带有{{ }} 的Vue代码放在 {% verbatim myblock %}标签中间,例如: <div id="app1">{% verbatim myblock %}{{ message1 }}{% endverbatim myblock %} </div>解决...
发现问题 最近在打开项目的时候，发现我的默认路由没加载上linkActiveClass，网上一搜，发现很多同学也有这个问题，查了一些资料发现这是个重定向的问题，官网文档是这么写的 https://router.vuejs.org/zh-cn/essentials/redirect-and-alias.html 重定向 重定向也是通过 routes 配置来完成，下面例子是从 /a 重定向到 /b： const router = new VueRouter({ routes: [ { path: /a, redirect: /b } ] })重定向的目标也可以是一个命名...
前言 Vue是什么，是一套构建用户界面的渐进式框架（官网解释），什么叫渐进式框架呢，简单回答就是主张最少，这些概念只能自己去看，自己去理解，一千个读者一千个哈姆雷特，不过多的解释。Vue官方文档 很全面的。 Vue是近两年来比较火的一个前端框架（渐进式框架吧），本文将给大家详细介绍vue cli使用绝对路径引用图片问题的相关内容，分享出来供大家参考学习，下面话不多说了，来一起看看吧。 正文： 在页面中使用绝对路径可通过...
相信很多小伙伴在用Vue-cli安装的脚手架开发的时候，在开发环境中项目可以很正常的运行，但是进入到生产环境，编译打包后，放入服务器，项目就不正常了，会出现空白页或者路由跳转404等问题。遇到这些问题不要慌张，正确的配置加上后端的简单配合就可以解决。 如何打包基于Vue-Cli,通过npm run build来进行打包的操作如何部署 将打包出来的资源，基于Vue-Cli的一般是dist目录下有static目录和index.html文件，可以直接将这两个文件...
Vue-Access-Control是一套基于Vue/Vue-Router/axios 实现的前端用户权限控制解决方案，通过对路由、视图、请求三个层面的控制，使开发者可以实现任意颗粒度的用户权限控制。 整体思路 会话开始之初，先初始化一个只有登录路由的Vue实例，在根组件created钩子里将路由定向到登录页，用户登录成功后前端拿到用户token，设置axios实例统一为请求headers添加{"Authorization":token}实现用户鉴权，然后获取当前用户的权限数据，主要包括...
Vue-Access-Control是一套基于Vue/Vue-Router/axios 实现的前端用户权限控制解决方案，通过对路由、视图、请求三个层面的控制，使开发者可以实现任意颗粒度的用户权限控制。 安装 版本要求 Vue 2.0x Vue-router 3.x 获取 git：git clone https://github.com/tower1229/Vue-Access-Control.git npm：npm i vue-access-control 运行 //开发 npm run dev//构建 npm build概述 整体思路 会话开始之初，先初始化一个只有登录路由的Vue实...
在vue的实际开发中往往会遇到公用一个组件的问题，比如有一个菜单中的两个按钮，点击每个按钮调用的是同一个组件，其内容是根据路由的参数的不同来请求不同的内容。 第一步，首先新建一个vue+webpack+vuecli的demo，如下操作： 全局安装vue-cli，vue-cil是vue的脚手架工具，安装命令： npm install -g vue-cli第二步，进入到工程目录中，创建一个vuedemo的文件夹工程，如下两步操作： cd vue_test_project //进入vue_test_project目...