随笔分类 - vue、vue2、elementUI 项目用到点总结
摘要:在项目中需要用到富文本编辑器,但是需要在菜单最后增加一个可点击按钮,点击后做其它业务处理。 富文本采用了wangEditor,因为简单轻巧 官网: http://www.wangeditor.com/, 文档:https://www.kancloud.cn/wangfupeng/wangeditor
阅读全文
摘要:项目中循环计时处理某些方法的情况还是比较常见的,一般会用setInterval来处理,但是这个方法会似的页面卡顿等使用体验不好。 所以就使用浏览器提供的requestAnimationFrame方法,window.requestAnimationFrame() 告诉浏览器——你希望执行一个动画,并且
阅读全文
摘要:遇到这个问题的原由是:本身自己项目的elementUI版本是2.0.11较低了,项目有个功能是自定义progress进度条颜色,无奈高版本的才有这个配置,所以就升级了elementUI,升级到了最高版本2.10.0。这样就出现问题项目中有的页面打不开并且造成浏览器窗口崩溃,于是就在卡顿的页面把代码全
阅读全文
摘要:1-10是开发流程,后面的是发布流程 1. 在Git里面…新建项目 2. 克隆项目到本地用来开发 git clone https://github.com/***/vue-prevent-browser-back.git 3. 运行命令行,初始化项目,生成package.json npm init
阅读全文
摘要:官方给的简单的例子以及效果。 最后弄成的效果: 按照文档在layout 添加slot, 这几个参数可以随意调换位置,然后分页显示效果会根据调换的位置显示相应内容。
阅读全文
摘要:vue项目中在某个页面阻止浏览器返回上一页,适用移动端、PC端。 使用场景例如: 首页 与 A页面 来回跳转,那样点击浏览器返回时也会来回跳转,本想当页面在首页的时候就不再返回了,所以这个时候需要阻止浏览器的返回。 用法:https://github.com/WangMaoling/vue-prev
阅读全文
摘要:做项目中需要对前端数据加密传输这个时候需要用到前端加密的算法主要是:Aes.js,Md5.js 一.Vue项目用到的aes.js加密。 1.直接在index.html引入aes.js或者在npm install 安装。 2.加密代码要放在Vue项目的assets目录这样build的时候可以压缩,在浏
阅读全文
摘要:1. 项目中用到的打印 页面: css: 控制好宽度一般A4 我调试的是794px多了放不下,小了填不满。当时多页打印的时候,一定要控制好每一个页面内容显示的高度不要超过一个页面,当然根据自己项目来。 由于我的项目是每一个页面固定一个页尾部,所以当显示的时候正常排版显示。但是一旦点击了打印预览需要修
阅读全文
摘要:总结项目用到的一些处理方法,用来解决数据处理的一些实际问题,所有方法都可以放在一个公共工具方法里面,实现不限ES5,ES6还有些Vue处理的方法。 都是项目中来的,有代码跟图片展示,长期更新。 1.获取两个给定日期之间所有日期集合 2.Vue深度监听对象 3.Vue filters过滤数据处理日期格
阅读全文
摘要:演示地址 1. 先动态渲染表头,给每一个表头添加一个class=virtual 的画虚线的类名,同时给每个表头加上鼠标点击、拖动、抬起事件:mousedown->mousemove->mouseup. 2. 点击时确定点击的哪个,拖动的时候确定拖动的方向,抬起的时候确定放在的位置。 3. 改变数据实
阅读全文
摘要:elementUI table表格一般的样式是这样的: 但是要改变表头是比较麻烦的一个事情,但是往往有些项目是需要的比如改成如下样式: 一般直接改起来挺麻烦,好在官网提供了一个方法:render-header 根据官方的方法来实现有两个方法: 方法一:vue的render函数来直接实现 运行效果:
阅读全文
摘要:最近项目发现一个问题table表头筛选的时候,由于筛选内容过多导致弹出框超出屏幕,并且无法滚动,应急的办法是缩小浏览器显示比例让更多内容显示😀 就是下图标识地方内容超出屏幕,ElementUI也没有做出处理: 只能强改了:打开浏览器调试找到页面的结构拿到class名字 el-table-filte
阅读全文
摘要:最近写了一个用node来操作MongoDB完成增、删、改、查、排序、分页功能的示例,并且已经放在了服务器上地址:http://39.105.32.180:3333。 Mongoose是在node.js环境下对mongodb进行便捷操作的对象模型工具,有人已经总结了使用方法,传送门 项目代码地址,欢迎
阅读全文
摘要:最近写了一个用node来操作MongoDB完成增、删、改、查、排序、分页功能的示例,并且已经放在了服务器上地址:http://39.105.32.180:3333。 本篇文章只做简单介绍,能够使用起来就OK,不深究 项目一共四部分: 1.MacOS下MongoDB数据库的安装配置。 2.MongoD
阅读全文
摘要:vue项目经常需要组件间的传值以及方法调用,具体场景就不说了,都知道。基本上所有的传值都可以用vuex状态管理来实现,只要在组件内监听vuex就好。 vue常用的传值方式以及方法有: 1. 父值传子(props) 1-1:解决一个项目中遇到的问题,父组件给子组件传值第一次子组件是可以接受的, 但是在
阅读全文
摘要:在vue开发中,需要使用scoped属性避免样式的全局干扰,但是这样在父组件中是无法被修改的,不仅如此如果项目中用了UI框架比如element Ui,这个时候在本组件也无法修改样式,因为权重问题。但是想要修改还是有方法的: 1. 在不去掉scoped的情况下,在全局样式中覆盖,这种解法,有弊端,可能
阅读全文
摘要:记住组件滚动状态: 使用场景:从某列表组件进入详情页,在返回的时候需要保留列表组件状态,包括滚动的高度。这个时候需要keep-alive配合。 方法一:如下情况导航在做普遍用法。前提是使用keep-alive keep-alive提供了两个钩子函数: 1. acvitaved: keep-alive
阅读全文
摘要:接上篇 https://www.cnblogs.com/wangmaoling/p/9803960.html 本文很长,请耐心看完分析。 4.高级用法,指定从什么组件进入才缓存,以及销毁缓存:先介绍我发现的网上一些博主写的有bug的方法,在介绍自己的方法。 接上篇 https://www.cnblo
阅读全文
摘要:本文很长,但是很详细,请耐心看完就一目了然了有下篇 keep-alive 是 Vue 内置的一个组件,使被包含的组件保留状态,或避免重新渲染。 1. 基础用法,缓存所有路由: <keep-alive> <router-view> <!-- 这里是会被缓存所有的视图组件 --> </router-vi
阅读全文
摘要:在Vue项目中使用scss,如果写了一套完整的有变量的scss文件。那么就需要全局引入,这样在每个组件中使用。 可以在mian.js全局引入,下面是使用方法。 1: 安装node-sass、sass-loader、style-loader 2: 安装sass-resources-loader (如果
阅读全文

浙公网安备 33010602011771号