CenterElse-CSDN博客

原创 2023代码小技巧

例如：如果你的loading = true写在 await上面，loading = false 写在 await下面，有的时候接口直接报错，你的loading就会一直转，执行不了 await下面的代码。所以这个时候 finally就有用了。不管成功与否都要执行的代码放在finally中。把请求服务的东西放在try里。

2023-11-14 10:10:53 213 1

原创前端文件上传下载

（1）第一种是后台放在服务器上面，然后前端直接访问就可以下载，此种前端不需要做额外的处理，可以用 type为download的a标签直接访问下载，也可以用window.open或location.href=""这种方式直接访问即可下载。（2）第二种是前端访问接口，然后后端返回二进制文件。前端完成解析后下载。本文主要介绍第二种方式的下载。

2023-11-03 17:03:08 241

原创 yarn install遇到的报错及解决方案20230509

解决2：忽略错误后重新yarn install：yarn config set ignore-engines true。先删除 package.json 的 tui-editor 配置项。解决1：换node版本(安装多个node版本然后)

2023-05-29 10:11:00 2572

所以用代码来实现全屏非全屏切换，非全屏切换时需要监听是否全屏后，才能运行非全屏代码。但是发现通过代码全屏的效果能用下方代码获取全屏状态，通过f11全屏的效果用下方代码无法获取全屏状态。我采用了禁用f11的方法。但是如果刷新浏览器，直接执行下方代码，会报错，不触发全屏效果。因为一开始就用的简单的宽度百分比，高度固定的布局，设计稿1920*1080，所以在非全屏下有些错乱，到笔记本上看更加错乱。另外对于用户通过其他方式如esc退出全屏的方法，可以通过侦听resize方法，获取全屏状态，来切换全屏非全屏按钮。

2023-04-24 17:09:31 1183 2

原创 echarts设置多级x轴

1.效果图2.实现的核心代码设置多个x轴xAxis:[ { type: 'category', data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'] }, { type: 'category', position: 'bottom', offset: 25, axisPointer: { type: 'none'

2022-04-13 17:14:00 6036

原创前端请求接口之content-type与传参

今天跟公司后端对接口，公司后端小盆友们为了省事，直接给我发截图，让我猜怎么请求接口，怎么传参。仔细研究了研究，发现如下信息：1.后端接口方法使用@RequestBody，证明前端得请求参数应该放在body里，使用application/x-www-form-urlencoded是不行的，因为当action为get时候，浏览器用x-www-form-urlencoded的编码方式把form数据转换成一个字串（name1=value1&name2=value2…），然后把这个字串append到url

2020-12-28 18:06:21 1780

转载 sass依赖包版本问题: The “path“ argument must be of type string. Received undefined vue sass

The “path“ argument must be of type string. Received undefined vue sass花费了我两个小时处理这个问题1.这是vue项目（由vue-cli创建）引入sass后，打包项目出现的错误。这个错误是sass-loader版本造成的解决方案：在package.json中将 “sass-loader”:" 10.0.1"版本修改为"sass-loader": “^7.3.1”,然后重新npm install2.创建完这个文件以后，又出现了新的错

2020-12-21 17:27:29 907

转载前端上传文件预览，FileReader or 对象 URL

1.FileReaderFileReader 实现了一种异步的读取机制。他必须先通过 FileReader() 构造函数创建出一个 fileReader 实例。该实例实现了一下几个方法和事件（部分）：readerAsDataURL(file): 读取文件并以数据 URI 形式保存在 result 属性中load 事件：在文件加载成功后触发 lo## 标题ad 事件error 事件：在文件加载失败后触发 error 事件progress 事件：在读取文件的过程中触发 progress 事件，该事件可

2020-12-10 14:27:42 471 1

原创 vue.nextTick和vue.set

一、vue.nextTick1.场景一：在Vue生命周期的created()钩子函数进行的DOM操作一定要放在Vue.nextTick()的回调函数中。在created()钩子函数执行的时候DOM 其实并未进行任何渲染，而此时进行DOM操作无异于徒劳，所以此处一定要将DOM操作的js代码放进Vue.nextTick()的回调函数中。与之对应的就是mounted()钩子函数，因为该钩子函数执行时所有的DOM挂载和渲染都已完成，此时在该钩子函数中进行任何DOM操作都不会有问题。2.场景二：在数据变化后要

2020-11-03 16:55:52 1480

原创 npm install 连接不上github解决办法

1.https://github.com.ipaddress.com/ 用ipaddress查询dns服务器地址2.在host文件里配置 xxx github.com3.使用npm ，尽量不用cnpm

2020-10-22 15:47:49 3652

原创纯vue+ui项目与小程序、uni-app开发的异同

一、前言有些人会问，不都是vue语法吗，有什么差异呢。我不是说的语法，我是说的使用方面。最近三个月一直在做移动端的项目。使用微信小程序原生和uniapp框架做开发，对vue的一些原始语法有些生疏。现在来对他们的一些差别进行对比。二、内容1.纯vue项目使用比如Element-ui、Ant-design、vant等ui框架来渲染界面。而weixin和uniapp则有自带的ui组件(当然也可以使用其他ui框架，比如uView)。2.纯vue项目需要使用vue-router及其导航首位来配置页面跳转。w

2020-08-06 18:44:11 1889

原创简单谈谈weex、nvue和vue

1.区别weex(we except，自己的理解)支持原生和vue并写，原生渲染，但是组件库不完善，仅支持编写app。nvue嵌入了weex引擎，又有uniapp丰富的组件库，相当于dcloud写的weex升级版。在uniapp中支持使用nvue和vue编写多端应用，唯一的不同是nvue使用原生的（和weex及react native类似）的渲染方式。vue是使用webview的方式渲染，性能可能有些差距。2.什么时候使用套用uniapp官方文档的一句话：如果您熟悉weex或react nativ

2020-07-14 11:54:14 7085

原创 js变量提升(语法小坑)

正如《你不知道的javascript》一书中说的，js是一门脚本语言，使用者不需要像学java一样完全语法等，甚至只会其中的一些简单的命令就可以直接开发了。但是开发越久越发现，在前端框架如此多的情况下，js基础等才是作为一个前端经久不衰的秘诀。看下方示例代码运行结果是什么：var c = 1function c(c) { console.log(c); var c = 3;}c(2);其实是报错：c不是一个function。是不是出乎一些人的意外。其实是js编译时的变量声明的

2020-06-19 09:17:37 200

原创 js中浅复制和深复制

前言：在使用webSocket通讯时，因为要用到Stomp(websocket的进一步封装)，而微信只提供了websocket。所以采用网上的封装方法。一开始声明了一个对象包含几个null方法，可是将其作为参数传递给stomp.js后，再使用其该对象的方法，居然有值。这不由让我想起来了js中的深复制(直接复制对象)，其实原理很简单。废话不多说，上图：ps.看别人代码会有意想不到的收获。...

2020-06-11 19:28:55 168

转载 vue项目中批量打印二维码

综合了两个文章实现。首先使用qrcode实现生成。然后window.open和window.print打印一、生成二维码（原文链接：https://www.cnblogs.com/feijiediyimei/p/11136607.html）最近项目有个需求，需要将一个连接生成二维码展示出来，然后在网上找到了QRCode这个插件，这里大致记录下它的使用方法介绍： QRCode.js 是一个用于生成二维码的 JavaScript 库。主要是通过获取 DOM 的标签,再通过 HTML5

2020-05-11 11:08:04 1889

转载 wx.request封装解决回调地狱(转载)

原文链接：www.xksblog.top/talk-about-…见到wx.request的第一眼，就让我想起了$.ajax这东西，使用起来确实有很多不方便，不能忍，幸好小程序是支持ES6语法的，所以可以使用promise稍加改造。先来说说wx.request为什么不能忍。铺垫：“看得见却抓不...

2020-05-08 20:19:37 496

原创 nginx配置vue前端代理

背景：做一个前后端分离的项目，使用vue-cli创建的前端项目，在前端配置跨域请求。一、开发阶段在vue.config.js中配置devserver的proxy进行代理请求配置，然后将所有请求改为/api开头的即可。但是这样配置只在开发阶段起作用。所以在nginx上部署的时候，需要再重新配置请求代理。vue.config.js中代码配置如下：// 相当于webpack-dev-server...

2020-04-21 16:48:22 6660 2

原创 2020.03vue常见问题总结

VUE常见问题由于vue是MVVM，日常经常有些渲染问题。1.绑定的元素(v-for)渲染出来的数据，尤其是对话框中。使用push、shift、splice等操作原数组的方法可使数据更新而不用重新渲染。2.js中尤其注意’='地址引用。3.element-ui上传组件的问题功能快捷键撤销：Ctrl/Command + Z重做：Ctrl/Command + Y加粗：Ctrl/Co...

2020-04-13 19:03:04 258

转载 -ms-viewport的问题

Internet Explorer 10并没有将屏幕的宽度和视口（viewport）的宽度区别开，这就导致Bootstrap中的媒体查询并不能很好的发挥作用。为了解决这个问题，你可以引入下面列出的这段CSS暂时修复此问题：@-ms-viewport { width: device-width; }然而，这样做会导致Windows Phone 8 设备按照桌面浏览器的方式呈现页面，...

2020-02-08 11:07:02 1169

原创处理ie8兼容

2020-02-08 10:52:03 239

转载 ajax提交data类型

一、来源用了好久vue，回顾一下原来项目的ajax的请求原伦理二、概念ajax有三种传递传递data的方式：json格式json字符串格式标准参数模式1.json格式形如：{“username”:”chen”,”nickname”:”alien”}ajax：$.ajax({ type:"post", url:"/test/saveUser", data...

2020-02-05 11:31:09 303

原创 jquery与vue项目的区别

因为jq是js封装的库，所以文章直接说原始模式，vue为数据绑定模式。1.原始方式和简单，第一步获取元素，第二步绑定事件，第三步进行操作。<li><a href="javascript:;" id="logout">退出</a></li>$("#logout").on("click",function(){ $.ajax({ ...

2020-02-05 11:09:02 448

原创 Thank you，kobe

众所周知，科比对于中国的80、90后的影响无与伦比，整个NBA乃至全世界的著名运动赛事那么多，为什么科比如此独特，因为他创造了曼巴精神。何为曼巴精神？大众耳熟能详的“凌晨四点钟的洛杉矶”只是其中的一部分。腾讯视频曾在科比退役的时候推出了关于科比接受各种采访及自传时候说的自己的精神力量的视频。称之为曼巴精神系列。这是关于热爱、信心、痴迷、恐惧、团队、勤奋、挑战、学习及驱动力的一场精彩人生旅程。一...

2020-02-03 19:09:20 857

原创 Vue全家桶之过滤器

vue过滤器通常用于对数据再渲染前进行一些复杂格式的转换。通常用于时间格式的转换第一步，再main.js中声明：第一个参数是过滤器的名字，被调用时使用。回调函数中的参数是使用时前面需要处理的数据。padStart函数是用于不足两位的时候补零。//设置时间格式过滤器Vue.filter('dateFormat', function(originVal) { const dt = new ...

2020-02-03 16:53:26 325

原创前端项目简单的构建

1.先说一下模块化规范require是Commonjs的规范，node应用是由模块组成的，遵从commonjs的规范。import是es6为js模块化提出的新的语法，import （导入）要与export（导出）结合使用。(1)commonjs输出的，是一个值的拷贝，而es6输出的是值的引用；(2)commonjs是运行时加载，es6是编译时输出接口；2.使用webpack打包发布(n...

2020-02-02 15:13:17 327

原创 Vue全家桶之vue-router

路由分为前端路由和后端路由，后端主要是通过识别请求路径，分发对应的资源，而前端路由主要是针对SPA单页面应用的局部刷新。识别触发的事件，分发对应的渲染内容。vue-router中的router-link就会默认被渲染为a标签，在其path中的路径上加上#采用hash链接的方式进行导航，从而渲染对应的组件。下面是使用vue-router的基本步骤：1.引入库文件2.添加路由链接3.添加路...

2020-02-02 15:11:47 200

原创 art-template模板浅析

关于art-template模板，收藏了两篇文章，讲的比较系统，简单来说就是一个数据和页面的拼接渲染模板。具体跟 Vue、React 这些前端主流框架比较的性能，官方并未给出数据，但是我认为只比较页面渲染能力的话，应该相差不多， Vue、React 是一整套的前端解决方案，而 art-template 只是一个 js模板引擎，二者定位和功能不同，不做详细比较，猜测 art-template 同样...

2020-02-02 15:09:31 551

原创 js中的同步异步运行机制及promise、异步函数

1.js先执行同步代码，异步代码放在异步队列中等待。2.异步函数不阻塞后续代码执行，所以异步函数return拿不到返回结果，需要使用回调函数将代码放在异步代码中。3.要想解决的话使用就异步按同步执行会出现回调地狱。使用Promise可以解决。4.但是promise还不够简便，然后就有了async异步函数配合 await。注意await后面接收Promise对象并解析其结果。5.异步函数默...

2020-02-02 15:07:23 406

原创 element-ui使用常见问题

1.最常见的问题：form表单的每一项的prop属性是为了提供表单验证，尽量填写，而且名字需要和每个表单项绑定的值的名字一致，否则表单验证validate方法和重置表单resetFields方法不起作用。2.el-menu-item菜单组件的index属性是可以起router作用的，必须是字符串。el-submenu的Index的值如果相同，则同时展开关闭一级菜单项。3.为防止默认激活（def...

2020-02-01 19:31:18 895

原创 2020年vue周边知识点整理(一)

（1）vue项目安装插件和安装依赖的区别。比如element-ui有的是安装插件，有的是直接安装依赖，保留问题。（2）token是登录请求成功后，由后台返回，然后前端保留在本地，和session的区别。（3）...

2020-02-01 15:43:00 594

Clearlove_8的博客