Vue2 Element-UI 表格随浏览器缩放高度自适应
创建指令创建文件夹el-table,在其下面创建adaptive.js内容如下:
import { addResizeListener, removeResizeListener } from 'element-ui/src/utils/resize-event'// 设置表格高度const doResize = async(el, binding, vnode) => { // 获取表格Dom对象 const { componentInstance: $table } = await vnode // 获取调用传递过来的数据 const { value } = binding if (!$table.height) { throw new Error(`el-$table must set the height. Such as height='100px'`) } const bottomO ...
iPhoneX样式适配
问题描述
iPhoneX由于新增了刘海以及取消了按键采用了小黑条的形式,导致会出现以下的问题:样式边缘出现了空白(没有覆盖整个可视区域)
我们可以通过meta设置解决这个问题
<meta name='viewport' content='initial-scale=1, viewport-fit=cover'>
于是出现了新的问题,部分内容被刘海和黑条遮盖了,接下来就有两种解决方案:
多媒体查询//iphoneX、iphoneXs@media only screen and (device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 3) {}即: 设备屏幕可见宽度为375px, 可见高度为812px及设备像素比为3 //iphone Xs Max@media only screen and (device-width: 414px) and (device-height: 896px) and (-we ...
Vue下载文件需要token校验
直接下载前端创建超链接<a :href='"/user/downloadExcel"'>下载模板</a>
点击事件触发function downloadExcel() { window.location.href = "/user/downloadExcel";}
token下载
注:数据返回类型必须为 responseType: ‘blob’
1.数据正常,后台返回 blob 文件流2.数据异常,后台返回 blob 类型异常信息
const downLoadFile = function (response, fileName){ if(response.type === 'jsonString' || response.type === 'application/json') { let reader = new FileReader(); reader.readAsText(response ...
Git经典操作场景
我刚才提交了什么?
如果你用 git commit -a 提交了一次变化(changes),而你又不确定到底这次提交了哪些内容。你就可以用下面的命令显示当前HEAD上的最近一次的提交(commit):
git showgit log -n1 -p
我的提交信息(commit message)写错了
如果你的提交信息(commit message)写错了且这次提交(commit)还没有推(push), 你可以通过下面的方法来修改提交信息(commit message):
git commit --amend --only #打开之后点击i键,进入编辑,最后:wq保存即可git commit --amend --only -m 'xxxxxxx' #直接修改
我想从一个提交(commit)里移除一个文件git checkout HEAD^ myfilegit add -A git commit --amend
我不小心删除了我的分支
如果你定期推送到远程, 多数情况下应该是安全的,但有些时候还是可能删除了还没有推到远程的分支。让我们先创建一个分支和一个新的文 ...
JavaScript闭包
什么是闭包?
由于在Javascript语言中,只有函数内部的子函数才能读取局部变量,闭包就是能够读取其他函数内部变量的函数。所以,在本质上,闭包就是将函数内部和函数外部连接起来的一座桥梁。
比如下面的代码:
function f1() { var n = 999; function f2() { console.log(n); } return f2;}var result = f1();result();//999
函数f2就被包括在函数f1内部,这时f1内部的所有局部变量,对f2都是可见的。但是反过来就不行,f2内部的局部变量,对f1就是不可见的。
这就是Javascript语言特有的”链式作用域”结构(chain scope),子对象会一级一级地向上寻找所有父对象的变量。所以,父对象的所有变量,对子对象都是可见的,反之则不成立。
既然f2可以读取f1中的局部变量,那么只要把f2作为返回值,就可以在f1外部读取它的内部变量了。
闭包的使用场景setTimeout
原生的setTimeout传递的第一个函 ...
Redis服务集群配置
Redis服务集群配置
介绍安装环境与版本:用两台物理机模拟6个节点,一台机器3个节点,创建出3 master、3 salve 环境。redis 采用 redis-3.2.1 版本。两台Linux物理机都是 CentOS ,一台 CentOS6.5 (IP:172.17.5.87),一台 CentOS6.5(IP:172.17.5.9)。
下载并解压cd /usr/local/rediswget http://download.redis.io/releases/redis-3.2.1.tar.gztar -zxvf redis-3.2.1.tar.gz
编译安装cd redis-3.2.1make&make install
将 redis-trib.rb 复制到 /usr/local/bin 目录下cd srccp redis-trib.rb /user/local/bin/
创建Redis节点首先在172.17.5.87服务器上/usr/local/redis/redis-3.2.1 目录下创建 re ...
Vue-Cookie
介绍
一个保存在客户机中的简单的文本文件, 这个文件与特定的 Web 文档关联在一起, 保存了该客户机访问这个Web 文档时的信息, 当客户机再次访问这个 Web 文档时这些信息可供该文档使用。
组成
Cookie是一段不超过4KB的小型文本数据,由一个名称(Name)、一个值(Value)和其它几个用于控制Cookie有效期、安全性、使用范围的可选属性组成。
vue实现token验证下载npm install --save js-cookie
创建cookie.jsimport Cookie from 'js-cookie';// name: cookie存储的名字// val: 需要存储的数据function getCookie(name) { return Cookie.get(name);}function setCookie(name, val) { Cookie.set(name, val);}function removeCookie(name) { Cookie.remove(name); ...
Vue-全局公共函数function
介绍
如果你需要让一个工具函数在每个组件可用,可以把方法挂载到 Vue.prototype上。
vue实现代码(获取URL参数, 防抖函数)创建util.jsexport default { /** * URL编码; * @param {参数} param */ toParams: function(param) { let result = ''; for (let name in param) { if (typeof param[name] != 'function') { if (param[name] === null) { result += '&' + name + '='; } else { result += '&' + name + '=' ...
JavaScript数组
slice()
slice() 方法返回一个新的数组对象,这一对象是一个由 start和 end 决定的原数组的浅拷贝(包括 start,不包括end)。
原始数组不会被改变。
//arr.slice(start, end)const arr = ['a','b','c','d']; console.log(arr.slice(2));//删除两个,从头开始删//["c","d"] console.log(arr.slice(2, 3));//只保存(从第二开始数(不包括第二个),数到第三个)// ["c"] console.log(arr.slice(1, 4));//只保存(从第一开始数(不包括第一个),数到第四个)// ["b", "c", "d"] console.log(arr.slice(-2));//保存后面两个// ["c", "d&q ...
JavaScript循环方式
for循环
最基本的循环方式,不多说。这种最基本的循环才是速度最快的,效率最高的。
for(var i = 0;i<5;i++){ console.log(i)}
for in循环
用来遍历对象的。要知道JavaScript对象的所有属性都是字符串,不过属性对应的值可以是任意数据类型。(注意:遍历时不仅能读取对象自身上面的成员属性,也能遍历出对象的原型属性)
let obj = {a:1, b:2, c:3};for (let prop in obj) { //prop指对象的属性名 //输出: a,1 b,2 c,3 console.log(prop, obj[prop]);}
for of循环
作为ES6新增的循环方法,这个方法避开了for-in循环的所有缺陷。而且,它可以正确响应break、continue和return语句。for-of循环不仅支持数组,还支持大多数类数组对象,例如DOM NodeList对象。但是for of也有一个致命伤,就像例子看到的,没有索引。对,这是优点也是缺点。遍 ...