![](https://img-blog.csdnimg.cn/20201014180756928.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
vue.js
素味平生
学习这件事,不在乎有没有人教你,最重要的是在于你自己有没有觉悟和恒心。
展开
-
element关闭弹框时清空表单内容
需求:关闭弹框时清空表单内容解决方法:使用@close事件,函数可以自定义 eg : resetForm()、closeDialog()<el-dialog :title="addTitle" :visible.sync="addVisible" @close="resetForm('ruleForm')"> <el-form :model="ruleForm"...原创 2019-11-01 12:16:00 · 10460 阅读 · 2 评论 -
[Vue warn]: Failed to resolve directive: modle (found in <ComponentA>)
报错原因:单词拼写错误解决方法:检查是否将model写成了modle温馨提示:编写代码要细心且严谨(这已经是我第二次犯类似的错误了)原创 2019-10-17 16:04:37 · 1473 阅读 · 2 评论 -
TypeError: compilation. templatesPlugin is not a function
错误原因:webpack不是最新版解决方法:1.删除node_modules,重新安装npm install2.安装最新webpack npm add webpack@latest原创 2019-09-24 10:09:48 · 6895 阅读 · 0 评论 -
Vue中使用md5加密
MD5用的最多的地方就是用户密码存储 文件校验安装:npm install --save js-md5在需要的文件中中引入,直接使用import md5 from 'js-md5';md5('login_pas')2.在main.js中转为原型使用import md5 from 'js-md5';Vue.prototype.$md5 = md5;thi...原创 2019-07-29 12:53:20 · 206 阅读 · 0 评论 -
Vue使用Antv F2
F2是一个专注于移动,开箱即用的可视化解决方案,完美支持 H5 环境同时兼容多种环境(Node, 小程序,Weex)。在Vue中使用F2移动端图表,详细步骤如下:npm安装npm install @antv/f2 --save在main.js中引用impor F2 from '@antv/f2';Vue.prototype.F2 = F2;在页面中使用,首先创建一...原创 2019-07-17 12:55:07 · 5849 阅读 · 0 评论 -
vue拖拽排序
awe-dnd一款可任意拖动排序的vue插件。支持桌面和移动端,拖拽过渡动画美观。支持vue1和vue2版本。安装:npm install awe-dnd --save引入:import VueDND from 'awe-dnd'Vue.use(VueDND)页面内容: <div class="list" id="items" v-for="ite...原创 2019-06-24 11:35:23 · 1017 阅读 · 1 评论 -
echarts的visualMap与其他类型颜色冲突
最近个人开发大屏用了echarts,遇到一个visualMap颜色冲突的问题,一个比较复杂的echarts图,会由好几个类型不同的图表组成,但如果你用了颜色渐变visualMap的话,会发现一个问题,他覆盖了你其他type图的颜色,这时,只需要加上visualMap:false即可。注:要加在你的数据后面,否则无效。代码如下,亲测有效...原创 2019-01-25 19:11:52 · 6959 阅读 · 3 评论 -
vue-awesome-swiper组件使用
vue项目轮播图使用vue-awesome-swipe组件注意:安装后可在package.json中查看安装的版本,有一个容易入坑的地方是swiper.css这个文件,因为版本不同,有的版本swiper.css位于node_modules下,不需要单独引入1.命令行安装npm install vue-awesome-swiper --save2.在main.js中引入,一定要引入...原创 2019-01-09 17:55:49 · 888 阅读 · 0 评论 -
Vue全局拦截
个人开发项目遇到了需要做全局状态拦截,分享一下解决方案拦截器 首先我们要明白设置拦截器的目的是什么,当我们需要统一处理http请求和响应时我们通过设置拦截器处理方便很多vue2.0之后,就不再对vue-resource更新,而是推荐使用axios。本人使用的是vue-resource调用的接口拦截代码:(使用时可打断点调试)Vue.http.interceptor...原创 2018-11-16 11:39:17 · 1398 阅读 · 0 评论 -
vue小图标 favicon不显示的解决方法
vue项目favicon不正常显示,或只显示在首页或登录页之后不显示解决方案:1.直接将favicon.ico放到根目录,与src,static同级2.在 webpack.dev.conf.js 文件里plugins里加入以下代码 new HtmlWebpackPlugin({ filename: 'index.html', template: 'inde...原创 2018-09-14 10:25:06 · 2672 阅读 · 0 评论 -
Vue 使用element-ui步骤条流程
负责项目所遇到的步骤条流程,给大家分享一下,效果如下注:vue2.0 项目该效果引用element-ui的步骤条,引用之前确保个人项目已安装Element安装命令:npm install element-ui然后在main.js中引入:确保安装引用成功后,就可以开始写步骤条代码了页面代码如下:通过判断active的状态去切换所在步骤的内容js代码如下:prev为...原创 2018-08-20 15:46:51 · 36220 阅读 · 23 评论 -
vue路由跳转回到顶部
在main.js中添加以下代码router.afterEach((to,from,next) => { window.scrollTo(0,0);})原创 2018-08-14 14:58:35 · 2479 阅读 · 0 评论 -
vue前端获取不到cookie
最近开发的项目在获取cookie时,遇到了一些问题,浏览器cookie确实存在,而前端却取不到,这个问题非常简单(我却看了两天,尴尬!)给大家分享一下我的解决方案首先,前端得检查自己获取cookie的方式是否正确,vue项目是有vue-cookies的,检查是否安装成功然后检查自己获取cookie的方式,贴上自己的代码,仅供参考(is_login)如果确保自己代码没问题后,去找后台...原创 2018-07-31 17:46:37 · 12809 阅读 · 0 评论 -
Vue项目搭建
vue-cli 项目搭建及常用插件安装,报错解决环境搭建 1. 安装 node.js (官网下载,按电脑版本选择32位或者64位) node - v 检测版本 2. 安装webpack npm install webpack -g webpack -v 检测是否安装成功项目搭建 1. npm in...原创 2018-07-16 10:50:29 · 204 阅读 · 0 评论 -
js alert 和 console.log 国际化多语言切换
我们在开发过程中调试代码不可避免的要用到 alert 和 console.log,一般 js 中 alert 和 console.log 中弹出和打印的信息都是直接写进去的,而对于第一次接触国际化的同学来说,并不知道 alert 和 console.log 怎么国际化,我刚开始的时候也不知道,百度的那些基本上没有什么用,没多长时间自己研究摸索出了怎么写国际化的 alert 和 console.l...原创 2018-07-04 18:20:32 · 1061 阅读 · 0 评论 -
Vue i18n 中英文切换
最近做的vue项目要实现国际化语言,自己琢磨看文档写出了一个简单的不能再简单的demo,供大家参考!注:vue-cli项目1.npm安装 npm install vue-i18n --save2.i18n使用,在项目入口文件main.js中引入 import VueI18n from 'vue-i18n'; 在 src 目录下创建一个 langu...原创 2018-07-03 16:24:47 · 1539 阅读 · 0 评论 -
vue常用插件安装
常用插件安装 1. 安装jquery npm install jquery --save -dev 在main.js 中引入 import $ from 'jquery' 2. 安装bootstrap npm install bootstrap --save --dev 在main.js 中引入 ...原创 2018-07-16 11:00:36 · 491 阅读 · 0 评论