- 博客(102)
- 收藏
- 关注
RSS订阅原创 箭头函数 =＞
ES6 允许使用「箭头」(=>)定义函数。箭头函数声明// 声明：let fun = (a, b) => { return a + b;}// 调用fun(1, 2) // 3特点箭头函数 this 指向声明时所在作用域下 this 的值，不会改变在这里插入代码片ES6 允许使用「箭头」(=>)定义函数。箭头函数的注意点:如果形参只有一个，则小括号可以省略函数体如果只有一条语句，则花括号可以省略，函数的返回值为该条语句的执行结果箭头函数 this
2021-07-31 20:49:31
201
原创 模板字符串 `` + 简化对象写法
模板字符串(template string)声明使用(本质是一个字符串)let str = `<ul> <li>我是一个字符串</li></ul>`console.log(typeof str) // String特点:字符串中可以直接进行换行操作（不需要拼接 ‘+’），如下代码不会报错let str = `<ul> <li>我是一个字符串</li></ul>`可以使用 ${x
2021-07-26 17:50:53
342
原创 v-show 和 v-if 的区别
v-show 和 v-if 的区别共同点都是用来控制元素的显示与隐藏的不同点V-show是对class样式切换；v-if是对Dom元素切换；频繁切换用v-show，切换消耗小，反之用v-if，运行条件很少改变，那为什么建议控制v-if 的使用v-if是真正意义上的“条件渲染”。符合条件就渲染，否则不渲染DOM，浏览器中找不到这个DOM。v-show严格意义上说“条件隐藏”。浏览器首先把HTML元素先渲染出来，符合条件就显示，不符合条件display就为none，不显示，但是元素还在那
2020-12-28 11:24:31
366
原创 promise有几种状态，什么时候会进入catch？
promise有几种状态，什么时候会进入catch？1）pending：在过程中，没有结果，不会触发then和catch2）resolved：已经解决，触发then3）rejected：已经拒绝，触发catch
2020-12-28 11:15:21
4718
转载 单页面应用的优点和缺点
单页面应用的优点和缺点优点：1，用户体验好，快，内容的改变不需要重新加载整个页面，基于这一点spa对服务器压力较小2，前后端分离3，页面效果会比较炫酷（比如切换页面内容时的专场动画）缺点：1，不利于seo2，导航不可用，如果一定要导航需要自行实现前进、后退。（由于是单页面不能用浏览器的前进后退功能，所以需要自己建立堆栈管理）3，初次加载时耗时多4，页面复杂度提高很多...
2020-12-28 11:12:24
1368
原创 vue css 中 scoped的实现原理
vue style 中 scoped的实现原理在vue文件中的style标签上，有一个特殊的属性：scoped。当一个style标签拥有scoped属性时，它的CSS样式就只能作用于当前的组件，也就是说，该样式只能适用于当前组件元素。通过该属性，可以使得组件之间的样式不互相污染。如果一个项目中的所有style标签全部加上了scoped，相当于实现了样式的模块化。vue中的scoped属性的效果主要通过PostCSS转译实现PostCSS给一个组件中的所有dom添加了一个独一无二的动态属性，然后，给CS
2020-12-28 11:10:39
1335
1
原创 Mac环境下生成SSH密钥
git 设置 ssh下载homebrew 和 gitruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"如果遇到问题参考另外一篇文章https://blog.csdn.net/Rainbow1995?spm=1011.2124.3001.5343题归正传：1：在终端输入ssh-keygen -t rsa -C "[email protected]" // 然后回车回
2020-12-22 11:11:12
888
原创 解决Failed to connect to raw.githubusercontent.com port 443: Connection refused
download homebrew 报错如下ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"curl: (7) Failed to connect to raw.githubusercontent.com port 443: Connection refused解决办法sudo vim /etc/hosts// 加上一句199.232.28.133 raw.git
2020-12-21 15:18:42
7827
3
原创 react面试部分
介绍一下你对 react-router的理解当写了很多react组件后，想要实现不同组件之间的切换和跳转的时候，就需要用到react-router了，如何安装react-routernpm install --save react-router-domimport { BrowserRouter as Router, Route, Link } from 'react-router-dom'//这里将BrowserRouter重命名为Routerredux的工作流是什么样的redux工作流r
2020-12-07 11:11:17
105
原创 element-ui DateTimePicker 日期选择 日期禁用
日期区间选择器，当开始时间变化，就将之前的日期禁用，结束日期变化，就将此日期之后的禁用，效果如图主要用到的参数picker-options 当前时间日期选择器特有的选项参考下表 <template> <el-form ref="form" :rules="rules" :model="form" :label-width="180px" class="form-style"> <div class="form-group...
2020-10-16 22:11:30
3030
原创 React 修改打包后静态资源引入路径：资源文件路径“/“修改为相对路径“.“
问题：由于部署的时候增加了二级域名，但是打包后的index.html中引入的静态资源路径是从根目录引入的，其实在根域名下并没有这个静态资源，导致引入失败，无法加载，如下图所示解决办法：在package.json 里边增加该配置 （当然，配置的地址可以由部署环境决定，可以是 './' , 也可以是 ‘../’,根据需要配置即可）"homepage":".",修改完成后，打包后的index.html 的引入路径就如下图所示，...
2020-07-23 16:41:43
9758
原创 npm WARN npm npm does not support Node.js vX.X.X NPM 打包的时候，报错说不支持此版本
遇到警告如下：npm WARN npm npm does not support Node.js v12.14.0npm WARN npm You should probably upgrade to a newer version of node as wenpm WARN npm can't make any promises that npm will work with this version.npm WARN npm Supported releases of Node.js are
2020-07-17 08:41:36
4250
转载 理解 JavaScript 的 async/await
阅读约 15 分钟随着Node 7的发布，越来越多的人开始研究据说是异步编程终级解决方案的 async/await。我第一次看到这组关键字并不是在 JavaScript 语言里，而是在 c# 5.0 的语法中。C# 的 async/await 需要在 .NET Framework 4.5 以上的版本中使用，因此我还很悲伤了一阵——为了要兼容 XP 系统，我们开发的软件不能使用高于 4.0 ...
2019-12-06 16:04:38
179
转载 Vue props用法详解
Vue props用法详解组件接受的选项之一 props 是 Vue 中非常重要的一个选项。父子组件的关系可以总结为：props down, events up父组件通过 props 向下传递数据给子组件；子组件通过 events 给父组件发送消息。父子级组件比如我们需要创建两个组件 parent 和 child。需要保证每个组件可以在相对隔离的环境中书写，这样也能提高组件的可...
2019-11-18 15:01:01
1173
原创 [Vue warn]: Error in nextTick: "TypeError: Right-hand side of 'instanceo
报错如下原因：props 中出传来的默认值给的是具体的字符串解决办法：将具体字符串变成String，类型解决根据：验证传入的 props 参数的数据规格，如果不符合数据规格，Vue 会发出警告。能判断的所有种类（也就是 type 值）有：String, Number, Boolean, Function, Object, Array, Symbol...
2019-11-18 14:58:59
1815
原创 Error in created hook: "TypeError: Cannot read property 'getAttribute' of undefined"
表现：vue项目中，进入页面的时候，报错如下原因：我把Echarts 的初始化，写到了created 的回调函数中了，解决办法：将初始化写到mounted的回调函数中理由：created: 在模板渲染成html前调用，即通常初始化某些属性值，然后再渲染mounted：在模板渲染成html后调用，通常是初始化页面完成之后，再对html的dom节点进行操作注意：如果是弹框中包...
2019-11-11 12:43:50
7230
1
原创 vue 登陆成功后携带不了后台传来的 set-cookie 并携带请求错误处理
正常情况下，当一个接口中反回了该值，其他接口再提交请求，浏览器会自动附加的，不需要你额外关心。但是使用了axios的时候，发现cookie携带不过去，原以为是没有获取到，后来发现是axios搞的鬼表现：登陆成功后，发送的接口中，没有携带过去cookie，导致后台获取不到cookie，并且返回错误信息原因：在axios中默认是不让后端写入cookie的解决办法：在main.js中或者...
2019-11-11 12:34:19
11000
4
原创 vue 中 Echarts 富文本如何使用
很早的一篇文章中我写了 Echarts 富文本不生效的解决办法，很多人看不明白，再来解释一下，如果你的写法没有出问题的话，在页面中还是不能正常显示你想要的样式，那么就要考虑是不是 echarts 的版本过低，建议升级使用效果图 和代码如下：<div class="echarts-content" ref="echartsRich"></div>le...
2019-11-05 13:13:24
1064
1
原创 vue 引入 scss 文件到 main.js 报错
在引入公共 scss 文件的时候，发现一直编译不成功，报错如下，This relative module was not found: * ./main. in ./src/main.js本来以为是路径写错了，直接放到平级目录，还是引入不成功，结果发现是sass loader 的问题找到 webpack.base.conf.js 文件，删掉以下配置{ test: /...
2019-08-08 20:29:40
1941
原创 vue-cli 搭建项目
用 Vue 已经很久了，但是没有想起来总结一下，今天先总结一些，慢慢补充，要知道每天的工作还是很饱和的所需环境nodenpmcnpm // 用于加快下载速度步骤1.在自己新建的文件夹中 打开命令行工具,全局安装 npm install -g vue-cli，2.vue init webpack + 项目名称 // 不可用中文3.然后会出现很多选择，如下1.Project ...
2019-08-05 20:30:08
180
原创 axios 请求改变请求头
如何携带请求头传参呢？this.axios({ url: 'https://www.baidu.com/' // 请求的 url 地址 method: 'get', // 请求方式 data: data, // 传递的参数 headers: { token: 'awregtiy7qo2fru8q9udeu78osi98fpuj0qi348ufc0O', // 例如t...
2019-08-05 19:50:51
4336
原创 Highcharts、Echarts、D3、该用哪个
收费角度 兼容性 难易程度 适用场景是否收费Echarts 完全免费，代码开源。 D3 完全免费，代码开源。 Highcharts 非商业免费，商业需授权，代码开源。兼容性Highcharts 兼容 IE6 及以上的所有主流浏览器，支持移动端缩放、手势操作。 Echarts 兼容 IE6 及以上的所有主流浏览器，支持移动端的缩放和手势操作。 D3 兼容IE9 及以上的所有...
2019-08-05 19:41:03
3083
原创 v-model.trim使用
v-model.trim用于去掉输入框内首尾空格如下绑定的时候加上.trim 那么如果直接在开头输入空格，或者是在末尾输入空格，是不会显示有输入内容的，<el-input type="textarea" v-model.trim="deleNsbp" ></el-input>之前看到有人问他赋值的时候，为什么不能去除前后的空格，当输入内容之后，前后空格就被解...
2019-07-26 12:48:54
32466
原创 promise 详解
Promise作用：主要是来解决Ajax的异步问题传统方式：回调函数来解决异步问题，类似如下问题ajax(url, { // 成功后回调 ajax(url, { // 成功之后再回调 ajax(url, { // 成功之后再回调 }) })})注意：一般情况下，如果请求成功，执行某个...
2019-07-26 12:43:40
2358
原创 Echars 如何描绘世界地图
Echarts 删除内置地图，官网给出的原因是这样的：ECharts 之前提供下载的矢量地图数据来自第三方，由于部分数据不符合国家《测绘法》规定，目前暂时停止下载服务。建议大家使用以百度地图为底图的形式，参考实例：https://echarts.baidu.com/demo.html#map-polygon虽然没有了内置地图，但是Echarts 给出了 ' 注册可用地图 ' 的方法...
2019-07-22 12:33:53
966
原创 图片如何居中
图片居中<div> <img src='' /></div>div { text-align:center; // 可使图片水平居中}img { vertical-align:middle; // 可使图片垂直居中}
2019-07-18 19:54:27
943
原创 button 去掉默认边框样式
刚开始写在html 中的按钮，会自带一个黑色边框，如果不想要，可以直接去掉，如下 <button>button</button> <button style="border: none;">button</button>或者给他重新设置边框样式...
2019-07-18 10:59:52
12130
4
原创 vue 提示弹框
分享一个很好用的提示弹框（几秒消失的那种）非常适用于前端内容增删改查成功或失败后的提示语templet 中的 Dom<div class="alsrtInfo" :style="{display: displayStsates}" ref="alertMsg"> <div class="profPrompt_test">{{aletMsg}}<...
2019-07-16 19:25:38
14864
原创 axios 请求传参
普遍的请求方式如何传参let params = {}params = { 'ie': 'utf-8', // 或者是变量 'idx': 'baidu' // 或者是变量}1. get 请求不传参 eg: https://www.baidu.comthis.axios.get('https://www.baidu.com/').then(res => {...
2019-07-15 18:19:23
1161
原创 如何判断 JSON 格式
如何校验输入的内容是否为 JSON 格式isJson (data) { if (typeof data === 'string') { try { var obj = JSON.parse(data) if (typeof obj === 'object' && obj) { retu...
2019-07-08 12:54:20
3745
原创 canvas 如何 清空画布内容
解决办法：重新给canvas赋值高度或者宽度canvas.setAttribute('height', 240)原理：当 canvas 得宽高发生变化时，会重新绘制canvas，里边得内容就为空了
2019-07-04 20:07:20
9204
原创 button 禁止点击
cursor: not-allowed; 只是改变了鼠标的样式而已，并没有禁止掉他的事件pointer-events:none; 这一行控制了点击事件是否执行，意思是点击不触发事件，所以如果想禁止掉按钮事件，两个都需要加上...
2019-06-27 14:31:59
6546
原创 Vue Router 的params和query传参刷新后参数丢失情况
经常遇到刷新页面参数丢失的情况，今天总结一下params是路由的一部分，创建路由时，须要在路由后边添加参数名。 query是拼接在URL后边的参数，创建路由时，不用必须添加，可以直接跳转的时候携带即可params 参数丢失分析因为 params 传参需要在路由后边添加参数名，例如：/:id/:name，所以，如果没有在配置中写，当页面刷新之后，所传参数就会消失 如果在路由中配置了参...
2019-06-11 15:50:33
12939
2
原创 sessionstorage 增删改查
sessionstorage 经常被前端用来存储一些数据，对数据的处理一般就是增删改查，增加和修改window.sessionStorage.setItem('名称', '数据内容')为什么把增加和修改归为一类，因为对于sessionStorage 的修改也是通过再次 setItem 来进行的删除单个数据window.sessionStorage.removeItem('...
2019-06-11 10:06:22
5748
原创 JavaScript Cookie
什么是 Cookie？Cookie 是一些数据, 存储于你电脑上的文本文件中。当 web 服务器向浏览器发送 web 页面时，在连接关闭后，服务端不会记录用户的信息。Cookie 的作用就是用于解决 "如何记录客户端的用户信息":当浏览器从服务器上请求 web 页面时， 属于该页面的 cookie 会被添加到该请求中。服务端通过这种方式来获取用户的信息。创建 和 修改 Cook...
2019-06-11 10:06:11
415
原创 sessionStorage 存储和获取对象
还记得第一次使用localStorage 存储了个数组，却一直显示为 [object，object]sessionStorage 也是同样的错误解决办法：存储对象window.sessionStorage.setItem('名称', JSON.stringify(对象数据))获取对象let content = JSON.parse(sessionStorage.get...
2019-05-30 13:26:43
7187
4
原创 localStorage 和 sessionStorage 的区别
localStorage 和 sessionStorage 的定义Web 存储 API 提供了 sessionStorage （会话存储） 和 localStorage（本地存储）两个存储对象来对网页的数据进行添加、删除、修改、查询操作。localStorage 用于长久保存整个网站的数据，保存的数据没有过期时间，直到手动去除。sessionStorage 用于临时保存同一窗口(或标签页...
2019-05-30 13:22:35
402
原创 localStorage 如何存储对象
还记得第一次使用localStorage 存储了个数组，却一直显示为 [object，object]解决办法：存储对象window.localStorage.setItem('名称', JSON.stringify(对象数据))获取对象let content = JSON.parse(localStorage.getItem('名称'))...
2019-05-28 21:00:01
15058
4
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人