文字渐变输入框失去焦点保存数组常用方法

最新推荐文章于 2023-12-24 22:05:32 发布

小王今天也要加油鸭~！

最新推荐文章于 2023-12-24 22:05:32 发布

阅读量433

点赞数 2

分类专栏：项目中error总结文章标签：前端 javascript vue.js

本文链接：https://blog.csdn.net/WANG944282/article/details/126779422

版权

项目中error总结专栏收录该内容

15 篇文章 1 订阅

订阅专栏

1. css设置文字渐变

CSS 实现文字渐变色 - 简书 (jianshu.com)参考这里。把容器的背景色设置渐变，文字颜色透明，背景按照文字裁剪，剩下的就是文字渐变啦。链接里还有第二种方法，可以了解下。

<span class="text-gradient">我是文字渐变</span>
.text-gradient{
    background-image: linear-gradient(180deg, #57FFF5 0%, rgba(87, 255, 245, 0.5) 100%);
    -webkit-background-clip: text;
    color: transparent;
    font-size: 26px;
    line-height: 36px;
}

2. input输入框在失去焦点或回车之后保存数据

如果失去焦点和回车绑定的是同一事件，那么每次回车后，该方法会执行两次，所以只需要让回车触发”失去焦点“事件就好了。如：

<input type="text" v-model="name" ref="nameInput" @blur="ChangeName" @keydown.enter="$refs.nameInput.blur">

3. 在vue项目中引入其他的html文件

把html文件写在public文件夹里
引入的时候使用’/?文件夹/文件名’, public目录下的，直接用/代表public，不需要再去…/翻层级

如：window.open('/other1.html', '_blank')，或者使用a标签<a href="/other1.html" target="_self"></a>

4. 数组常用操作

数组切割/筛选

splice(index，count，?('str1' , 'str2'))，用于删除数组元素，或者替换元素。

当只传前两个参数的话，就是删除元素，删除开始位置的索引，删除的数量，可以配合arr.indexOf(str)一起使用，来确定索引下标。

如果继续传其他参数的话，就是把索引位置的元素替换为其他字符串，这个是可以传多个的，按照传的顺序依次插入
slice(begin, end)用于保留元素。包含begin，不包含end，是左闭右开的区间

如[a,b,c,d].slice(1,3) => 结果就是[b,c]
arr.filter(item => item === value)返回值是满足条件的数组

item是arr里面的每一项，item===value是条件，当然这个按照自己的需求写。不改变原数组，返回满足条件的新数组。

数组增删/修改

改变原数组的方法：

arr.pop()从数组末尾删除一个元素，返回值为删除的元素
arr.push(item)从数组末尾增加一个元素，返回值为改变后数组的长度
arr.shift()从数组开头删除一个元素，返回值为删除的元素
arr.unshift(item)从数组开头增加一个元素，返回值为改变后数组的长度
arr.sort()重新排序数组，默认从小到大

可以改变顺序。升序：arr.sort(function(a,b){return a-b}); 降序：arr.sort(function(a,b){return b-a});