自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

峰会路转的博客

爱生活,做个积极向上的人

  • 博客(91)
  • 收藏
  • 关注

原创 iview 点击按钮下载文件

日常业务中会出现文件下载的需求,但是我们在下载图片,等浏览器能识别的文件时,不是下载而是在网页打开,即使在a链接中添加download属性也是不行的。经过实践,下面的方法可以解决 click: (el) => { /* console.log(el, 'el') */ let alink = document.createElement('a') fetch(row.url.

2020-11-30 14:31:25 74

原创 iview input实现点击和enter同时搜索技巧

<Input v-model="keyword" search suffix="ios-search" placeholder="请搜索海报" style="width: 200px" @on-search="searchPaper" />

2020-11-16 12:29:00 114

原创 vue post导出excel方法记录

{ responseType:'blob'}是post和get都必须传的数据 this.$http.post('xxxxxxxxxxxx', postData, { responseType:'blob'}).then(response => { const blob = new Blob([response], { type: 'application/vnd.openxmlforma

2020-11-10 12:27:58 84

原创 iview 框架 中input带 search-icon图标的点击事件 无效怎么处理

<Input v-model="name" search enter-button placeholder="搜索表单" style="width:200px" @on-enter="searchForm" @click.native="searchForm" ...

2020-11-04 20:08:53 273

原创 vue2.0父子组件的生命周期先后顺序

今天在做iview项目的时候,子组件的的初始化数据必须从父组件的初始化数据里取到数据后发请求执行顺序如下:父组件 created 子组件 created 子组件 mounted 父组件 mounted如果有多个子组件:父组件created钩子结束后,依次执行子组件的created钩子 多个子组件的created执行顺序为父组件内子组件DOM顺序 多个子组件的mounted顺序无法保证,跟子组件本身复杂程度有关 父组件一定在所有子组件结束mounted钩子之后,才会进入mounted

2020-10-29 21:04:57 50

原创 mac 打字卡顿的解决方法

用mac系统打字会出现延迟的现象,显示跟不上你的手速,可以如下操作系统偏好设置--辅助功能--键盘--慢速键选项--拉到对低效果好了很多了...

2020-08-16 23:03:38 1631

原创 mac 一个窗口新建多个终端窗口

1.打开一个窗口光标移动到终端,command+ N代开一个新的窗口2.在一个新窗口中建立多个终端窗口,command+ T,即可实现

2020-08-08 21:49:17 112

原创 antd 安装时一直报错 There appears to be trouble with your network connection. Retrying...

使用yarn 命令报超时错误解决方法:yarn config set registry https://registry.npm.taobao.org然后再安装就可以了!

2020-08-04 22:06:43 331

原创 element ui el-time-picker 时间选择其组件的坑点记录

需求:需要进行一个时间区间的选择遇到的问题:需要设置默认值,只需要拿到小时和分的时间格式。<el-time-picker is-range style="width:500px" //必须设置宽度,不然会导致刷新或初始化的时候撑不开这个组件 :disabled="isDisabled" v-model="form.time" r

2020-08-03 10:25:38 2373

原创 element ui el-upload 图片上传组件间的坑点记录

需求:使用的el-upload组件实现图片上传和图片的反显 <el-form-item label="场地图片:" class="site-icon"> <el-upload :action="''" list-type="picture-card" :limit="form.limit" ref="upload" .

2020-08-03 10:14:28 540

原创 mac docker配置镜像的方式

版本是19.03.12,配置方式有所变化,特记录下然后 docker info标示配置成功!

2020-07-31 10:24:39 212

原创 elementui的async-validator验证数字类型的探究

现在的项目在使用elementui的做表单验证的时候,框架默认使用的是async-validator,但是很多坑在这里!今天记录下怎么验证number类型的输入值。<el-form-item label="联系电话:" style="margin-left:20px" prop="tel"> <el-input v-model="form.tel" style="width:400px"></el-input></el-form-item>.

2020-07-03 15:03:07 492 1

原创 Vue 中的jsx写法探究

平时我们习惯了写模板的方式来写vue组件,但是有时候这样会很浪费代码量,于是我们可以改用jsx写法,例如我们要封装这样一个组件,最原始的方式我们是不是要写很多个v-if来进行判断,但是这不是我们想要的 <h :level="1">这是h1</h> <h :level="2">这是h2</h>jsx里面的正文是export default { props: { level: { type: Number,

2020-06-17 22:00:35 135

原创 JS 中合并数组中的多个对象为一个的方法

var arrObj = [{a:1, b:2},{c:3, d:4},{e:5, f:6}];//mergedObj = {a:1, b:2, c:3, d:4, e:5, f:6}//es6的解决方式const arrObj = [{a: 1, b: 2}, {c: 3, d: 4}, {e: 5, f: 6}];console.log(arrObj.reduce(function(result, current) { return Object.assign(result, cu.

2020-06-15 13:11:09 586

原创 vue 中sync修饰符的使用方法

我们可能需要对一个 prop 进行“双向绑定”。不幸的是,真正的双向绑定会带来维护上的问题,因为子组件可以变更父组件,且在父组件和子组件都没有明显的变更来源。父组件中:<parent :age="age" @setAge="res => age = res"></parent>data () { return { age: 10 } },子组件中: <div> {{age}} &lt

2020-06-07 22:37:47 83

原创 Vue里面的slot与slot-scope探索

slot在vue里面是插槽的意思,我们熟悉了其用法的话,刻意很方便的进行组件的开发父组件里面的使用<template> <div> <h3>我是一个父组件</h3> <hr> <child> <!-- template外面不能再套div --> <template slot="a" slot-scope="childData"> &lt

2020-06-06 21:59:44 52

原创 Vue里面的provided,inject实现响应式数据探索

这种传递数据的方式不是响应式的,官方文档说是可以为之,那么我们要实现响应式的传递,那该怎么处理呢?首先来看我们正常的使用方式: import Son from './Son' export default { provide () { return { text: this.test } }, data () { return { test: "parent-text" } .

2020-06-06 21:34:47 202

原创 js从一个属性结构的数据提取需要的属性数据,并进行递归

问题抛出: 接口返回如下的数据,现在用element-ui的cascader组件做一个树形结构的下拉展示const arr = [ { kind: '百度1' }, { kind: 'google', children: [ { kind: '小王' } ] }, { kind: '小王' }, { kind: '王五', children: [ {...

2020-06-01 21:47:42 99

原创 Vue CL3 配置路径别名

最近用Vue Cli3脚手架搭建了Vue项目,发现没有build目录了,里面的webpack相关的也没了,看了官方文档后,查了资料后,发现都在vue.config.js里来配置了const path = require('path')function resolve(dir) { return path.join(__dirname, dir)}module.exports =...

2019-11-11 16:12:23 94

原创 vuecli3的环境变量配置

https://cli.vuejs.org/zh/guide/mode-and-env.html今天在看vuecli3的环境变量配置,记录下学习笔记。一般来说会经历本地开发、测试脚本、开发自测、测试环境、预上线环境,然后才能正式的发布。对应每一个环境可能都会有所差异,比如说服务器地址、接口地址等等。在环境切换的时候,就需要不同的配置参数,所以就可以用环境变量和模式,来方便我们管理。你可...

2019-11-11 14:52:59 310

原创 js驼峰转连字符

vue源码的实现方式//驼峰转连字符 var r1 = /([a-z])([A-Z])/g; function parseToLink(str) { return str.replace(r1, function (_, g1, g2) { return g1 + '-' + g2.toLowerCase() }) }...

2019-11-10 20:42:01 91

原创 vue-cli 3 搭建项目一般流程

1.卸载之前的版本npm uninstall vue-cli -g2. 安装3.x版本npm install -g @vue/cli3.图形化新建项目方法,在项目空文件夹下打开终端,运行vue ui4.命令式新建项目vue create myapp5.安装完成之后,跑项目npm run serve...

2019-09-30 15:24:41 43

原创 mac系统npm 安装淘宝镜像

安装好node,npm然后执行以下的命令sudo npm install -g cnpm --registry=https://registry.npm.taobao.org --verbose

2019-09-30 14:20:38 180

原创 元素float,relative,absolute,fixed之后层级的高低浅析

主要记录的是谁覆盖谁的问题。测试环境chrome浏览器 元素float——一个元素浮动,另一个元素不浮动 <div class="pareant"> <div class="son son1"> son <span>span</span> </div> <div c...

2019-07-30 10:28:54 1046

原创 封装自己的koa--koa剖析

koa是在express基础上封装起来的,使用起来比express要简单很多用express跑一个我们的服务器const http = require('http');const serve = http.createServer((req, res) => { res.writeHead(200) res.end("hello world")})serve.l...

2019-07-29 20:42:47 81

原创 算法系列4--js选择排序

选择排序也是分内外两层,跟冒泡排序比,选择排序是不稳定的。需要借助交换函数 function swap(i, j, array) { var temp = array[j]; array[j] = array[i]; array[i] = temp; }取外层的每一轮的i为基准值,与内层的j进行比较,如果j项比min项小...

2019-07-29 15:49:56 30

原创 算法系列3--js冒泡排序

//i是外层的游标,j是内层的元素 function swap(i, j, array) { var temp = array[i]; //临时存储位置的值 array[i] = array[j]; //把j位置的值交给位置 array[j] = temp; //临时存储的值交给j位置 }/* function...

2019-07-29 14:50:52 37

原创 js改变placeholder字体颜色

效果图:css部分 .tel_input.change::-webkit-input-placeholder { color: #499FF0; } .tel_input.change::-moz-placeholder { color: #499FF0; } .tel_input.change::-ms-input-...

2019-07-29 10:44:32 465

原创 vuejs2.6的v-slot入门解读尝鲜

在开始解读之前,先确保package.json里面的vue版本升级到2.6版本,版本2.5不会生效核心目录结构,这里为了便于区分,组件的名字取得比较特殊,实际项目中大家根据需要去命名。1、普通的使用方法slot2-5.vue文件的内容<template> <div> <div> <slot>&lt...

2019-07-26 14:53:38 95

原创 一个无聊的面试题(2)

jq里面如何一次性删除多个class?jq里面删除类的内置方法:removeClass(),当然第一反应也是想到这个方法?然后面试的人就反问了,是不是要多次removeClass,被带到沟里去了。的确平时都只是用来删除单个class,比如当前激活的active,显示隐藏!今天查了下w3c这个api的具体使用方法用法描述写的很清楚了!小公司的面试问题都很偏门!应该是...

2019-07-25 11:05:45 57

原创 一个无聊的面试题(1)

0.1+0.7 = ?这个结果是多少?当时第一反应就是 !=0.8。没有计算机的情况下,具体这个结果是多少,我也不知道!也只写了一个!=0.8。这是继0.1+0.2 != 0.3之后的一个Js小数(浮点数)计算的坑!具体的原因大家可以去百度下JS浮点数计算的精确度问题!今天测试记录了下喜欢刨根问底的话,非要== 0.8怎么办?...

2019-07-25 10:51:22 44

转载 正向代理与反向代理区别图解 (nginx)

1. 背景经常听到代理,比如通常我们要上国外的网站时,需要买vpn作为跳板机器进行访问。但是在公司里面也听到了nginx支持反向代理。那什么是正向代理,什么是反向代理?在网上看了写内容,说一下自己的理解。2.正向代理正向代理,是在用户端的。比如需要访问某些国外网站,我们可能需要购买vpn。并且vpn是在我们的用户浏览器端设置的(并不是在远端的服务器设置)。浏览器先访问...

2019-07-25 10:14:04 46

原创 原生js技巧点滴3-call,apply,bind

call,apply,bind是JS里面的改变作用域的三种方式,区别很明显,call参数是一个个穿进去的,apply的参数是数组,bind跟call,apply不同的是,bind绑定对象后,没有立即执行,前面的两个有执行。下面来实现自己的call,apply,bindcall的自定义实现function a(){ console.log(arguments)}va...

2019-07-18 19:25:50 66

原创 js设计模式5-观察者模式(发布-订阅)

发布—订阅模式又叫观察者模式,它定义对象间的一对多的依赖关系,当一个对象的状态发生改变时,所有依赖于它的对象都将得到通知。1、原生DOM事件的订阅发布者模式。 window.onload = function () { //body订阅/观察了一个‘点击’事件 document.documentElement.addEventListener('cli...

2019-07-16 17:22:51 33

原创 js设计模式4-策略模式

策略模式是指定义一系列的算法,把它们一个个封装起来,并且使它们可以相互替换。策略模式通俗点就是业务选择逻辑的优化封装,if/else,switch...case的高级应用function calculatorBonus (level, salary) { if (level == 'A') { return salary * 4 } if (level == 'B...

2019-07-16 15:55:30 51

原创 js-函数的防抖和节流

窗体滚动使用window.addEventListener,document有的不反应; 窗体滚动滚动高度获取:window.pageYoffset(IE9+), document.documentElement.scrollTop(PC),document.body.scrollTop(Mobile); 普通元素直接scrollTop; 窗体高度获取:window.innerHeigh...

2019-07-12 15:55:09 41

原创 vuejs几种通信方式-

Vue的几种通信方式,今天这里做点笔记,源码使用的是非构建版的代码1、父子组件之间通信父组件通过props的方式向子组件传递数据 <div id="app"> {{msg}} <component-p :text="text"/> </div> const componentParent = { ...

2019-07-11 21:22:43 102

原创 算法系列1--js数组排序

两个数组合并成一个数组请把两个数组 ['A1', 'A2', 'B1', 'B2', 'C1', 'C2', 'D1', 'D2'] 和 ['A', 'B', 'C', 'D'],合并为 ['A1', 'A2', 'A', 'B1', 'B2', 'B', 'C1', 'C2', 'C', 'D1', 'D2', 'D']。自己研究的解法:var a = ['A1', 'A2'...

2019-07-11 13:18:14 178 1

原创 算法系列1--js转置矩阵

给定一个矩阵A,返回A的转置矩阵。矩阵的转置是指将矩阵的主对角线翻转,交换矩阵的行索引与列索引。输入:[[1,2,3],[4,5,6],[7,8,9]]输出:[[1,4,7],[2,5,8],[3,6,9]]输入:[[1,2,3],[4,5,6]]输出:[[1,4],[2,5],[3,6]]见图思路分析:此处省略1000字,重点MARK:1.输出的数组长度是...

2019-07-10 17:35:35 54

原创 算法系列1

给定一个整数数组 nums和一个目标值 target,请你在该数组中找出和为目标值的那两个整数,并返回他们的数组下标。你可以假设每种输入只会对应一个答案。但是,你不能重复利用这个数组中同样的元素。分析:思路很多,基本是遍历这个数组,进行逐个相加找出那个元素,返回下标var twoSum = function(nums, target) { var len = nu...

2019-07-10 13:05:39 32

空空如也

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人 TA的粉丝

提示
确定要删除当前文章?
取消 删除