随笔分类 - vue
关于vue.js的技术
摘要：解决方法： // An highlighted block .tabNews .el-tabs__item:focus.is-active.is-focus:not(:active) { -webkit-box-shadow: none; box-shadow: none; } 问题展示方式：
阅读全文
摘要：1.在chrome浏览器打开下插件网站：https://crxdl.com/，下载《SwitchyOmega》插件包文件； 2.将chrome浏览器的"更多工具"》“扩展程序”》开启开发者模式，具体如下图： 3.将下载后SwitchyOmega插件包找到该压缩文件夹下的crx后缀文件，拖拽至chro
阅读全文
摘要：之前多人开发项目，vue-cli3的框架，没有特别的配置eslint，导致代码写的各不相同。最近有时间鼓捣一下。 vue-cli3如何配置eslint 先安插件 eslint-plugin-vue（支持vue规则）eslint-plugin-node（支持nodejs规则）eslint-plugin
阅读全文
摘要：require.context是什么 一个webpack的api,通过执行require.context函数获取一个特定的上下文,主要用来实现自动化导入模块,在前端工程中,如果遇到从一个文件夹引入很多模块的情况,可以使用这个api,它会遍历文件夹中的指定文件,然后自动导入,使得不需要每次显式的调用i
阅读全文
摘要：介绍： extend：扩展组件的构造器，当我们调用vue.component('a', {...})时自动调用 mixins：接收对象数组（可理解为多继承），可以混入多个mixin， extends：接收的是对象或函数（可理解为单继承），extends只能继承一个 1.extend Vue.exte
阅读全文
摘要：地图改造总结 应用地图兼容百度地图、高德地图改造背景 满足需求所用高德地图更换为百度地图，进而对该应用地图进行开发拓展，以满足不同的地图需求。 2. 地图改造总结 2.1. 在lib文件夹下创建mapAdapter文件夹，相关文件介绍如下图： 2.2. 提取业务代码中使用的地图公共api，进行封装在
阅读全文
摘要：vue 开发过程中，保存一次就会编译一次，如果能够减少编译的时间，哪怕是一丁点，也能节省不少时间。开发过程中个人编写的源文件才会频繁变动，而一些库文件我们一般是不会去改动的。如果能把这些库文件提取出来，就能减少打包体积，加快编译速度。本文主要讲述在 vue-cli3 中利用 DllPlugin 来进
阅读全文
摘要：1 <!-- @format --> 2 3 <template> 4 <div> 5 <!-- <input type="file" v-show="false" @change="change" /> --> 6 <!-- 生产环境 --> 7 <!-- action="http://cysto
阅读全文
摘要：1.在项目主目录下的.eslintrc.js中 没有该文件需要新建一个该文件 代码如下，团队可自行定义如下eslint的规则 1 // https://eslint.org/docs/user-guide/configuring 2 3 module.exports = { 4 root: true
阅读全文
摘要：<!-- @format --> <!-- 模块 校管-课程管理-课表管理 -修改课表信息弹框 --> <template> <div> <el-dialog width="600px" :title="dialogInfo.title" :close-on-click-modal="false"
阅读全文
摘要：pickerOptions1: { disabledDate: time => { if (this.endTime) { return ( time.getTime() > new Date(this.endTime).getTime() || time.getTime() < Date.now(
阅读全文
摘要：1.利用Cookie，来设置接口携带的‘token’ 执行命令npm install js-cookie，在js工具类中引入， /** @format */ import Cookie from 'js-cookie'; function getToken() { return Cookie.get
阅读全文
摘要：一、利用lib-flexible、postcss-plugin-px2rem插件 进行移动端rem适配。 1、第一 引入lib-flexible . 安装lib-flexible： npm i lib-flexible --save-dev 在项目的入口main.js文件中引入lib-flexibl
阅读全文
摘要：这里分享下如何在webpack工具构建下的vue项目，在手机端调试和预览，言归正传。 1.电脑和手机连接到同一个WIFI a.台式电脑和手机同时链接一个路由器，使用同一个wifi； b.笔记本也可以直接启用一个wifi，手机链接笔记本wifi也可以； 2.查询本地IP地址 WIN+R，输入cmd回车
阅读全文
摘要：在vue项目中用vuex来做全局的状态管理， 发现当刷新网页后，保存在vuex实例store里的数据会丢失。 原因： 因为store里的数据是保存在运行内存中的,当页面刷新时，页面会重新加载vue实例，store里面的数据就会被重新赋值初始化 解决思路： 将state的数据保存在localstora
阅读全文
摘要：原 Vue路由传参的几种方式 2018年07月28日 23:52:40 广积粮缓称王 阅读数 12613 前言：顾名思义，vue路由传参是指嵌套路由时父路由向子路由传递参数，否则操作无效。传参方式可以划分为params传参和query传参，params传参又可以分为url中显示参数和不显示参数两种方
阅读全文
摘要：vue调试工具vue-devtools安装及使用（亲测有效，望采纳） 最后付上（Vue.js is detected on this page的解决方法） 本文主要介绍 vue的调试工具 vue-devtools 的安装和使用 工欲善其事, 必先利其器, 快快一起来用vue-devtools来调试开
阅读全文
摘要：vue的双向绑定原理及实现(摘抄别人的，但别人也是摘抄的 ，不知道原创是谁，看到了 在补上) 前言 使用vue也好有一段时间了，虽然对其双向绑定原理也有了解个大概，但也没好好探究下其原理实现，所以这次特意花了几晚时间查阅资料和阅读相关源码，自己也实现一个简单版vue的双向绑定版本，先上个成果图来吸引
阅读全文
摘要：Object.defineProperty() 和 Proxy 对象，都可以用来对数据的劫持操作。何为数据劫持呢？就是在我们访问或者修改某个对象的某个属性的时候，通过一段代码进行拦截行为，然后进行额外的操作，然后返回结果。那么vue中双向数据绑定就是一个典型的应用。 Vue2.x 是使用 Objec
阅读全文
摘要：问题描述：只要页面没有强制刷新，存在组件切换，bus.$on方法会被多次绑定，造成事件多次触发 触发bus.$on中绑定的方法.png bus.$on多次绑定.png 解决办法：在每次调用方法前先解绑事件( bus.$off )，然后在重新绑定( bus.$on ) bus.$off("backUp
阅读全文
