走在路上的晶晶丫-CSDN博客

原创 vue 在当前窗口中打开了新窗口，执行操作后需要关闭新窗口并且刷新老窗口

最近在项目过程中遇到了棘手的问题在父窗口中打开子窗口，在子窗口中执行完操作后关闭子窗口并且刷新父窗口的页面一开始通过sessionstorage实现，在父窗口对子窗口进行监听，发现怎么也实现不了后来，通过查询sessionstorage的生命周期只在当前窗口，后来改用localstorage实现发现对子窗口的监听实现不起效果，但是localstorage中的值发生了变化，但是监听事件不起效果最后两行代码解决了这个问题，一起分享一下window.opener.location.rel

2020-11-23 20:42:18 3141

原创 http中的301、302、307、308有什么区别？

原文来自https://www.cnblogs.com/wuguanglin/p/redirect.html状态码的解释301 Moved Permanently（永久移动）被请求的资源已永久移动到新位置，并且将来任何对此资源的引用都应该使用本响应返回的若干个URI之一。如果可能，拥有链接编辑功能的客户端应当自动把请求的地址修改为从服务器反馈回来的地址。除非额外指定，否则这个响应也是可缓存的。新的永久性的URI应当在响应的Location域中返回。除非这是一个HEAD请求，否则响应的实体中应当包

2020-09-16 10:06:59 4273

原创 js splice和slice区别

slice() slice()定义：从已有的数组中返回你选择的某段数组元素 slice()语法：arrayObject.slice(start,end) 注： ①：start表示从何处开始选取，end表示从何处开始结束选取，表示一个选取的范围 ②：start可以为负数，此时它规定从数组尾部开始算起的位置。也就是-1 ，指最后一个元素，-2 指倒数第二个元素，以此类推 ③：end如果没有被指定参数，数组会包含从 start 到最后一个数组元素的所有元素 ④：slice()方法不会修...

2022-04-29 14:48:34 384

原创 vue 在vue文件中引入子组件后，eslint导致组件未引入的解决办法

问题前提：vue3项目，启用eslint在vue引入一个子组件，在components中也注册了该组件，在template中也写了该组件，但eslint就是报错注册未使用组件。举一个例子import EditLogDetail from "@/views/LogDetail/EditLogDetail.vue";在components中注册components: { EditLogDetail,},在html中使用<edit-log-detail ref="..

2022-04-29 14:45:23 1401

原创 element plus 引入icon

vue升级到3版本后，引入的element 就是element plus了不管是从官方文档还是自己使用过程中突然发现element plus引入icon是需要单独去引用的，其实说实话有点鸡肋，不明白为什么单独引用。废话不多说，上解决办法1、全局引入main.js 引入import * as ElIcons from "@element-plus/icons-vue";for (const iconName in ElIcons) { vue.component(iconName,

2022-04-29 14:37:55 5720

原创 vue 清除字符串中的空格

一般如果是输入框的话，直接禁用空格即可，我们已知的可能是直接调用trim方法即可，但是在使用element ui 时，可以直接在输入框上设置trim，会比提交后再调用trim方法实用的多<el-input v-model.trim="value"></el-input>如上图所示，直接在v-model上加trim输入框就无法输入空格了当然如果非要用正则方式去去除空格也是可以的方法如下图所示clearBlank(value){ if(value){

2022-02-17 11:37:25 7057 1

原创 css 怎么样可以不用转换格式保持文章原来的格式

一般都是后台返回一大堆html的东西，前台进行显示。一般的做法肯定是<div v-html="content"></div>但是如上图所示的话，如果content内容中有\n的话是没有办法自动换行的，但是如果是<br/>的话，文章就会自动换行如果想让出现\n的时候也要支持自动换行的话，就需要对content进行切片转换具体转换方式之前也有文章写过：https://blog.csdn.net/qq_42949209/article/details/11

2022-02-17 11:30:54 1180

原创 el-upload增加token(element ui)

element ui 中的el-upload接口中是不传token的如果后台没有加限制上传文件会报token错误下面介绍给el-upload增加token<el-upload class="upload-demo" ref="upload" action="https://jsonplaceholder.typicode.com/posts/" :on-preview="handlePreview" :on-remove="handleRemove" :file-l...

2021-12-13 16:38:14 5324

原创 canvas拖动，鼠标带有粘性如何处理

给canvas所在的标签设置一个css属性即可<div id="box"></div><style>#box{ user-select:none;}</style>设置如上树形即可解决画布拖动到外侧/输入框/文字上后，画布拖动不起作用的问题。有其他问题我们再探讨。...

2021-11-22 15:03:25 476

原创用typeof区分Array和Object类型

细心的人会发现，用typeof区分不出来Array和Object类型，因为打印出来他们都是object类型那数组和对象应该怎么区分开来呢用下面这个办法，就可以区分开来了，list为对象/数组类型的数据Array.prototype.isPrototypeOf(list)打印结果，若结果为true，代表list为数组类型，若结果为false，代表list为对象类型。...

2021-11-20 13:51:25 1222

原创【css】鼠标禁用样式

有时候需要用到鼠标滑上去直接显示禁用仅需要设置一下样式即可.text:hover{ cursor:not-allowed; /* 光标是一个红色的圈加一个斜杠）*/}如此设置即可click点击失效pointer-events:none;注意二者不能同时使用...

2021-11-03 11:47:34 1381

原创【css】文字超过几行就不显示，默认显示...

.text { width: 200px; word-break: break-all; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; /* 这里是超出几行省略 */ overflow: hidden;}给对应需要显示的div加上对应的class即可实现...

2021-11-03 11:42:53 198

原创【flutter】学习

在对vue比较熟悉之后目前还想学习学习flutter大家有没有推荐的教程或者文章之类的！可以推荐给我谢谢大家

2021-11-02 17:33:06 62

原创 vue 内存溢出导致打包报错

vue3内存溢出导致报错先执行2个npm命令npm install cross-env increase-memory-limitnpm run fix-memory-limit

2021-06-08 10:46:08 857

原创 css 实现文字纵向排列并居中

CSS属性write-mode实现文字竖排.wordWrapClass{ word-wrap: break-word;/*英文的时候需要加上这句，自动换行*/ /*自测了这句话没啥用*/ writing-mode: vertical-rl;/*从左向右从右向左是 writing-mode: vertical-rl;*/ writing-mode: tb-rl;/*IE浏览器的从左向右从右向左是 writing-mode: tb-rl；*/ text

2021-06-08 10:27:04 2930

原创 vue 怎么往一个数组前面加一个数组

这个也是我最近新发现的小功能在数组前界面新加数组，组合成一个新的数组利用js里面的unshift方法，可以实现这个操作比如有一个数组为l

2021-06-04 15:36:50 7672

原创 elementUI中select下拉框设置了多选multiple之后一进页面就触发校验bug

其实这个原因具体的也不知道因为什么，但确实将multiple属性去掉后，一进页面触发校验的Bug就没有了，如果知道具体的原因的网友们也可以评论告诉我一下，但找到了解决办法。具体的解决办法如下：...

2021-06-03 10:57:46 2137 5

原创 vue 在系统不兼容360浏览器时弹出提示的隐藏bug

在系统使用过程中，经常会出现一些js浏览器识别不出来，就会出现输入系统的网址，出现一片空白的情况在这种情况下，我们应该给使用者弹出一个提示，说明系统在当前浏览器不适用，应该下载别的浏览器进行使用在这种情况下，也会出现用IE8版本以下的浏览器进行使用，这个时候我们一些新的ES6特有的一些属性，就无法适用了比如let定义参数，在IE8以下版本就无法起作用，只有用var才能使用。这也是遇到的一个很大的坑了一般弹出提示我都会在public文件夹下的index.html里面引入一个js判断是否是火

2021-05-24 09:48:55 507

原创 vue 超时设置，不操作系统，超时退出；一直操作系统，以最后一次操作系统为准算超时时间

最近在项目过程中加超时的设置，登录后，每次后台都会在response的头部返回给一个token，并且利用这个token作为新的请求头部的token传给后台，以此来保证在操作系统的过程中，不会因为超时而被强制退出系统的不合理要求一直在操作系统，超时时间的开始时间以最后一次操作系统的时间开始计时我们可以在自主封装的接口里面写这个方法，但是我们需要在后台返回的response的headers里面拿到最新的token，但是一般情况下我们只能在response的headers里面看到type，看不到token

2021-03-04 15:59:05 1015 1

原创 vue 给div增加title属性

在很多时候，我们页面上其实有时候展示不出来很多很多文字的，这个时候我们就不得不对这个文字进行处理，但是我们鼠标放到文字上时，还想展示所有的文字，这种方式其实有2种第一种是运用element ui的一个组件Tooltip 文字提示，常常用于鼠标hover时的提示信息话不多说上代码<el-tooltip class="item" effect="dark" content="Top Left 提示文字" placement="top"> <el-button>上边&

2021-01-29 15:11:35 13531 2

原创 vue 截取字符串

这篇文章是截取字符串的，之前也用到过这个js方法，但是今天在用的时候竟然忘记了，索性就记录下来吧假如time:2021-01-22 11:59:49但是我们只需要2021-01-22那就需要对字符串进行截取话不多说，上代码time.subString(0,10)这样拿到的值就是2021-01-22啦subString中第一个参数是截取的初始位置，10是截取多少位还有什么疑问可以留言一起讨论呀...

2021-01-22 12:04:23 783

原创 vue 根据关键词，在已查询回来的接口中筛选数据，不用根据关键字一遍遍改变，一次次调接口的烦恼

这个问题间接也相当于匹配的问题吧，这样既避免重复调接口出现问题，提升了程序的运行效率，另外，真的特别特别的好用！！之前也一直知道这个方法，但是从来没自己写过这类型的方法。还一直在用老旧的方法（监听关键词变化，重复调接口），当时的自己还觉得特别好用，但其实是占用了很多运行空间，这次恰巧不巧的必须使用根据关键词匹配去筛选数据的问题，就来分享一下吧。话不多说上代码<label> <input type = "text" v-model = "keywords">

2021-01-21 14:46:05 538

原创 2021-1-21 我又回来啦

我写CSDN博文的原因很简单记录我在项目中遇到的一些小问题以及发现的一些小技巧记录一下解决这些问题的解决方案可能遇到的问题很小但是也算是一种积累之后遇见了可以轻而易举的解决最近简直忙到不行都没有时间积累今天我又要开始啦！...

2021-01-21 14:30:53 49 1

原创 vue 另外一种根据\n分解一篇文章，并且添加首行缩进的方法

原理是根据\n将一篇文章分成不同的字符串压到一个数组当中，循环这个数组，给数组的每一项增加首行缩进的css样式就可以啦content是带\n的一篇文章arr是分解后存字符串的数组lastContent是最后我们输出带首行缩进和换段的最终结果话不多说上代码let arr = content.split(/[\n]/)这行代码就已经根据\n将一篇文章分解成多个字符串啦对arr数组中的每一项增加css样式就可以啦for (let i = 0 ; i < arr.lengt

2021-01-07 11:31:52 1724

原创 vue element-ui重置$message使弹窗只能出现一次

这个需求不经常遇到，但是遇到了可以这么修改场景：操作过程中连续点击按钮弹出很多错误提示或者函数执行多次产生很多错误提示弹窗不友好，修改为只弹出最后一次的提示；1、在util里新建一个resetMessage.js 文件/**重置message，防止重复点击重复弹出message弹框 */import { Message } from "element-ui";let messageInstance = null;let mainMessage = function DoneMessag

2021-01-05 18:12:53 1606 2

原创 vue 判断当前所用浏览器是什么l

判断当前所使用的浏览器是什么浏览器的话很简单，因为每个浏览器他的内核不一样，通过内核判断当前是什么浏览器就很容易了话不多说上代码var explorer =navigator.userAgent;if (explorer.indexOf("MSIE") >= 0) { //ie alert("ie");} else if (explorer.indexOf("Firefox") >= 0) { //firefox alert("Firefox");

2021-01-05 17:36:12 1605

原创 vue js \n替换成＜br＞ \s替换成&nbsp

这篇文章主要是用来记录后台返回一篇文章时对他的格式进行修改的操作1 自带html标签的文章，这种的话非常简单了，假设后台返回的文章内容放在content字段中，直接在vue中利用v-html=“content”，这样就可以正确显示文章的格式了2 不带html标签的文章，后台李用\n或者空格来表示换行或者首行缩进，这样的话我们就需要将\n转换成<br>标签，将空格(\s)转换成 ，再利用v-html=“content”，就可以正常显示啦content = conte

2021-01-05 17:21:35 2815

原创 vue postman使用方法

postman可以在线使用或者下载下来使用都可以官网：postman下载官网本来想找官网的链接挂上的，但是一直在转圈圈就等会儿吧~目前使用postman调用接口的方式主要是POST请求和GET请求，put和delete已经很少用了就只举例POST和GET请求吧GET请求一般是带参或者不带参不带参数：带参数：POST请求一般是带参写的有点繁琐，但是能看懂就好啦~下次再来分享呀...

2021-01-04 20:49:02 2137

原创 vue 修改时间格式

在我们在书写vue组件的过程中，我们往往需要针对时间格式的各种格式来回切换，这次我们说一说时间戳转换成时间字符串的方法假如后台给我们返回了一个时间字段（假设字段为date），但是他返回的是时间戳，那我们想要显示成XXXX-XX-XX这种格式就需要针对时间戳进行转换方法formatDate(time) { if(null !== time){ var date = new Date(time) var YY = date.getFullYear() + '-'

2020-12-17 10:20:47 2266

原创 vue 重置表单

vue 中有许多组件的form表单自带了重置表单的方法，这个重置表单具体有什么作用呢以element-ui框架为例，form表单中，我们可能会给form表单其中的一项或者某几项增加校验规则，但是我们在保存表单后，再次点开表单，发现校验规则的提示不会消失，那就是因为我们没有重置表单的原因啦其实重置表单很简单，在需要的地方加一行代码就可以啦this.$refs['loginForm'].resetField()加上上面这一行代码就可以啦，其中loginForm是我们自定义给form表单的ref

2020-12-13 18:10:12 1161

原创 vue 循环调接口异步问题

最近在项目过程中，有出现默认显示属性第一条数据的问题，当然在想到实现这个功能时，一般大多数人都想着循环调用接口，判断接口中是否有返回值，再进行操作，但是我们调用接口一般是异步操作，这样的话，接口不会等待在返回值中的判断等操作，会连续调用N次接口，返回的值是，最慢执行完接口操作并且有返回值的数据，但是这样会导致几个问题，第一是返回的数据不稳定，必须根据接口调用速度的快慢来决定返回数据到底是什么；第二是这样会大大加大调用的进程，易用性不是特别好因而我们就需要在调用第一次接口后，对接口的返回值进行判断，判断是

2020-12-11 21:44:55 2495

原创 vue 切换页面滚动条始终在顶部

这个问题也是最近项目中遇到的问题首先第一类是，数据是通过调接口获取到的，这种的话就非常简单了，因为每次点击菜单都会重新调用接口查询内容，这样的话，在调用接口前将数据赋值为空就可以了第二类是，数据通过一次性接口获取到的，这样的话我们就得另寻他路了，从网上也找了很多的方法，但是都不是很清晰明确，我也把我的内容分享出来吧~第一，我们要明确，出现滚动条的是哪一层DOM，给出现滚动条的DOM加一个id选择器第二，在切换菜单时，一定会触发一个方法，去改变出现滚动条的数据，在这个数据获取到之前，将混动条置

2020-12-10 20:14:46 1624 2

原创 vue 搜索高亮关键字

在一些查询中，我们希望我们查询的关键字，可以在查询内容中高亮出来this.arr = response.data this.caseList = [] this.arr.forEach(item => { this.caseList.push(item) console.info(item, '11111111111111') }) this.caseList.map(item => { item.context = this.

2020-12-09 19:04:50 469

原创 vue 换一换功能

大家自己去百度上看一下他们的换一换功能，就能明白是什么意思啦在普通一点的说，换一换功能与分页功能一致，以百度首页为例，当前页面为1，当前页面的数据为6，当前数据为1-6，在点击换一换之后，数据会变成7-12，那这个是如何实现的呢，原理就在于每点击一次换一换的时候，当前所在页面+1，即在查询时查询第二页的6个数据，就变相的达到了分页的效果了，然而我们多点几次，发现在数据为30之后，再点击换一换，数据又回来了，这里的话就需要加一个限制，当当前的页数为5时，将当前页面数重新赋值为1，这样数据就可以轮着换啦..

2020-12-09 18:43:57 1215

原创 vue vue.set vue.delete的具体用法

vue.set是vue原生的API具体的使用就是给特定的对象加一个属性，话不多说上代码export default() { data() { food: { name: 'apple' } }}...Vue.set(food, 'count', 1);这段代码的意思是，像food这个对象中插入count的属性，并复制为1...

2020-12-09 16:36:37 454

原创 vue 冒泡事件

冒泡事件例子：我们在使用中多数情况下只使用冒泡监听。例如一条购物车信息，在这条信息中，右下角有一个删除按钮。点击这条消息可查看详情，点击删除按钮可将此商品移除。我们会分别给信息的div和删除button添加一个冒泡的click事件监听。如果不做阻止传递，点击删除button后，会显示商品详情。显然这不是我们想看到的。这时我们给button一个阻止事件传递的功能，点击删除按钮后，事件就会结束，就不再显示商品详情。...

2020-12-01 15:33:57 565

原创 WangEditor富文本编译器图片上传问题

最近在做项目的过程中用到了富文本编辑器，上网络上查询，其实有很多类型的富文本编辑器，一开始为了功能的完整性和美观性，原来打算使用tinymce富文本编辑器，但是由于在使用过程中出现了问题：1 使用过程中一直报错 2 使用文档是英文的，我英文太差了为了项目的进度，不得不换成现有的比较好用的WangEditor富文本编辑器，不得不说是挺好用，文档也通俗易懂，但是在富文本编辑器中上传图片的功能到目前位置还是有一些问题，但有一个不是很合适的解决办法。WangEditor富文本编辑器上传图片有2中方式，一种是

2020-12-01 10:23:50 857

空空如也

空空如也