- 博客(44)
- 资源 (17)
- 收藏
- 关注

原创 vue---excel导入导出以及本地模板下载
<template> <div> <el-input style="width:150px" v-model="input" disabled placeholder="文件上传名字"></el-input> <el-upload action="url" :data="{}" :before-uplo...
2019-10-25 14:48:35
1298
5
原创 CSS 的 inherit、initial、revert 和 unset区别
关键字行为inherit继承父元素的值。initial重置为 CSS 规范中的初始值(默认值)。revert重置为浏览器默认样式表中的值,或继承父元素的值(如果可继承)。unset如果是可继承属性,则继承父元素的值;否则重置为默认值。
2025-03-14 13:39:41
412
原创 vue el-table排序功能
这个对象中可以获取到我们需要的两个值,一个是需要排序的值即列上绑定的prop值;以及排序的方式descending。会传递一个对象给我们定义的方法。在需要使用排序的列上添加。
2025-03-11 10:45:27
324
原创 javascript-----转义单引号&转义双引号
在 JavaScript 中,反斜杠()是一个转义字符,用于对特殊字符进行转义。在你提到的\'和\"\':用于转义单引号。在字符串中,如果你想包含一个单引号字符而不结束字符串,可以使用\'。:用于转义双引号。在字符串中,如果你想包含一个双引号字符而不结束字符串,可以使用\"。
2025-01-09 09:37:13
400
原创 变量提升&函数提升
变量提升:只提升声明,不提升赋值。函数提升:提升整个函数声明,允许在函数声明之前调用。函数表达式:提升变量声明,赋值不会被提升,因此会导致undefined。
2024-11-23 07:07:31
387
原创 深入理解js中函数中的形参与实参
javascript中的函数定义并未指定函数形参的类型,函数调用也未对传入的实参值做任何类型检查。而在其他语言中,可以为一个函数编写两个定义,只要这两个定义的签名(接受的参数的类型和数量)不同即可。定义函数的时候,传入的实参都写入一个单独的对象之中,在调用的时候传入一个对象,对象中的名/值对是真正需要的实参数据。在向参数传递基本类型的值时,被传递的值会被复制给一个局部变量(命名参数或arguments对象的一个元素)当形参并没有对应的实参时,arguments对象的值与形参的值并不对应。
2024-11-14 11:01:18
877
原创 一文搞懂 Vue3 defineModel 双向绑定:告别繁琐代码!
type如果要使用系统内置的修饰符比如trim子组件也无需做任何修改,和上面其他的也支持自定义修饰符,比如我们要实现一个将输入框的字母全部变成大写的uppercase自定义修饰符,同时也需要使用内置的trim修饰符。<template>// get我们这里不需要},});</script>这时我们给传进去的第一个参数就是包含get和set方法的对象,当对modelValue变量进行读操作时会走到get方法里面去,当对modelValue变量进行写操作时会走到set方法里面去。
2024-11-12 15:50:30
1035
原创 一文读懂什么是http的强缓存以及协商缓存?简单易懂
大家好,我是inline,一个专注前端领域的同学。今天犹豫了很久要不要写http的强缓存和协商缓存,写的话 掘金很多大佬的文章都已经说的很详细很易懂了,有耍大刀和水文章的嫌疑。但是不写又想自己做个总结,写出来加深一下印象。犹犹豫豫的还是决定写一篇,如果有哪里说的有误不详细还望各位看官多多包容体谅。
2024-11-07 10:25:10
930
原创 彻底理解粘性定位 - position: sticky
粘性定位可以被认为是相对定位(position: relative)和固定定位(position: fixed)的混合。元素在跨越特定阈值前为相对定位,之后为固定定位。在 视口滚动到元素 top 距离小于 10px 之前,元素为相对定位。之后,元素将固定在与顶部距离 10px 的位置,直到视口回滚到阈值以下。粘性定位常作用在导航和概览信息(标题,表头,操作栏,底部评论等)上。这样,用户在浏览详细信息时,也能看到信息的概览和做一些操作,给用户带来便捷的使用体验。
2023-11-21 11:27:20
1103
原创 变量提升的常见情况总结
把当前上下文中带有var(提升声明)/function(提升声明+定义)进行提升的声明或者定义。变量提升是将变量声明提升到它所在作用域的最开始的部分。window。
2023-10-10 18:33:15
1037
原创 Vue3.2 setup语法糖
起初Vue3.0版本变量和方法都是要return出来才可以使用,很不友好。在Vue3.2版本推出了 `setup` 语法糖之后,属性和方法都不需要 return 出去了,组件也不需要注册就可以直接使用了,下面慢慢来介绍。
2023-03-23 18:12:10
349
原创 观察者模式VS发布订阅模式区别
比如发布者发布了很多消息,但是不想所有的订阅者都接收到,就可以在调度中心做一些处理,类似于权限控制之类的。观察者模式: 观察者(Observer)直接订阅(Subscribe)主题(Subject),而当主题被激活的时候,会触发(Fire Event)观察者里的事件。以意图来分辨模式,都是实现了对象间的一种一对多的依赖关系,当一个对象的状态发生改变时,所有依赖于它的对象都将得到通知,并自动更新,那么他们就是同一种模式;观察者模式由具体目标调度,每个被订阅的目标里面都需要有对观察者的处理,会造成代码的冗余。
2022-12-02 14:09:58
2661
原创 js---常用的源码
1.函数柯里化函数柯里化的是一个为多参函数实现递归降解的方式。其实现的核心是:要思考如何缓存每一次传入的参数传入的参数和目标函数的入参做比较这里通过闭包的方式缓存参数,实现如下:使用方式如下:函数柯里化仅仅只是上面求和的这种运用吗??这个问题,有必要去一下。其实利用函数柯里化这种思想,我们可以更好的实现函数的封装。就比如有监听某一事件那么就会有移除该事件的操作,那么就可以利用柯里化的思想去封装代码了。或者说一个输入 A 有唯一并且对应的输出 B,那么从更大的角度去思想这样
2022-04-19 17:45:27
1593
原创 vue----实现列表拖拽排序的功能
<template> <div class="test_wrapper" @dragover="dragover($event)"> <transition-group class="transition-wrapper" name="sort"> <div v-for="(item) in dataList" :key='item.id' class="sort-item" :draggable="true" ...
2022-04-06 17:59:16
1942
3
原创 vscode---格式化设置setting配置以及一键生成vue片段
{ "vetur.format.options.tabSize": 4, "vetur.format.scriptInitialIndent": true, "vetur.format.defaultFormatterOptions": { "prettyhtml": { "printWidth": 140 }, "prettier": { "singleQuote": true, "printWi.
2022-01-07 14:30:07
913
1
原创 NVM安装使用教程
卸载node控制面板-》程序-》node直接卸载下载nvm地址:Releases · coreybutler/nvm-windows · GitHub推荐1.17版本,不需要环境变量配置安装完直接在目录C:\Users\Administrator\nvm的settings的文件中写入node_mirror: https://npm.taobao.org/mirrors/node/npm_mirror: https://npm.taobao.org/mirrors/np..
2021-11-23 18:13:51
331
原创 cesium---图加载
//矢量就是边框图,影像就是真实的图片效果,地形图就是初中地理书上的那种window.viewer = this.viewer = new Cesium.Viewer("cesium", { //离线或者不是WebMapTileServiceImageryProvider这种的都可以写在这里 imageryProvider: new Cesium.BingMapsImageryProvider({ url: "https://dev.virtualearth.net", key:.
2021-10-28 15:33:13
1490
1
原创 cesium 学习笔记
Cesium简介Cesium是一个基于JavaScript的开源框架,可用于在浏览器中绘制3D的地球,并在其上绘制地图(支持多种格式的瓦片服务),该框架不需要任何插件支持,但是浏览器必须支持WebGL。Cesium支持多种数据可视化方式,可以绘制各种几何图形、导入图片,甚至3D模型。同时,Cesium还支持基于时间轴的动态数据展示,例如,我们可以用它绘制卫星运行轨迹。Cesium HelloWorld下面的例子在浏览器中显示一个太空背景、具有地图覆盖的3D地球:index.htmlX
2021-06-30 17:44:20
2406
1
原创 css3 --- 实现动画线条运动效果实例集合
CSS3实现动画线条运动效果实例集合(一)laoyuan2016-12-20标签:css3阅读: 5,157在我们日常的开发中,有时候有的图片,布局块需要加一下边框运动效果,对于这些效果,我们可以使用CSS3动画属性animation,再配合css的一些技巧制作出来。下面是收藏的一些效果实例。1、边框流动效果html:<div class="css3-1"> <span>css3效果的内容部分</span> </div...
2021-04-25 10:02:29
3842
原创 js---继承6种方式
js继承的6种方式想要继承,就必须要提供个父类(继承谁,提供继承的属性) 一、原型链继承 重点:让新实例的原型等于父类的实例。 特点:1、实例可继承的属性有:实例的构造函数的属性,父类构造函数属性,父类原型的属性。(新实例不会继承父类实例的属性!) 缺点:1、新实例无法向父类构造函数传参。 2、继承单一。 3、所有新实例都会共享父类实例的属性。(原型上的属性是共享的,一个实例修改了原型属性,另一个实例的原型属性也会被修改!).
2021-04-08 16:46:32
119
原创 element中 仿$confirm 确认框
前端交互中经常使用确认框。在删除、修改等操作时,调用后端接口之前,先跳出弹框显示提示信息,提示用户确认,避免用户误操作。项目中全局引入了Element UI,提供了一套模态对话框组件,用于消息提示、确认消息、提交内容,使用起来也非常简便。(什么是“模态”?可将其理解为:特定条件触发之后产生的)以下来自于element官网文档:如果你完整引入了 Element,它会为Vue.prototype添加如下全局方法:$msgbox,$alert,$confirm和$prompt。因此在Vue ...
2021-01-13 19:31:38
5485
原创 连接两个div的直线,拖动时保持连线
连接两个div的直线,拖动时保持连线。效果:连接两个div带箭头的虚线,拖动div时保持线条实时改变位置保持始终连接效果图:1.产品经理提出的需求用带箭头的虚线将两个位置不固定的div连接起来,初听到这个需求一头雾水,传统的div可以做直线,但斜起来不太好做,幸亏之前接触过svg,里面有一个line标签,知道起始中止两个点的位置,就可以将两个点连接起来了。至于箭头,可以这么做先定义箭头: <svg> <defs>
2020-12-26 21:33:33
2578
3
原创 Cesium学习笔记
Cesium学习笔记Cesium是一个基于JavaScript的开源框架,可用于在浏览器中绘制3D的地球,并在其上绘制地图(支持多种格式的瓦片服务),该框架不需要任何插件支持,但是浏览器必须支持WebGL。Cesium支持多种数据可视化方式,可以绘制各种几何图形、导入图片,甚至3D模型。同时,Cesium还支持基于时间轴的动态数据展示,例如,我们可以用它绘制卫星运行轨迹。Cesium HelloWorld下面的例子在浏览器中显示一个太空背景、具有地图覆盖的3D地球: 1 2
2020-12-11 16:33:00
868
原创 vue---iframe的postMessage跨域通信
前端爬坑日记之vue内嵌iframe并跨域通信下面将3天的爬坑最终以问答的方式总结如下:1、Vue组件中如何引入iframe?2、vue如何获取iframe对象以及iframe内的window对象?3、vue如何向iframe内传送信息?4、iframe内如何向外部vue发送信息?1、Vue组件中如何引入iframe?<template> <div class="act-form"> <iframe :src="src"><
2020-09-16 15:02:50
1845
原创 webSocket---知识点
WebSocket我们一直使用的http协议只能由客户端发起,服务端无法直接进行推送,这就导致了如果服务端有持续的变化客户端想要获知就比较麻烦。WebSocket协议就是为了解决这个问题应运而生。WebSocket协议,客户端和服务端都可以主动的推送消息,可以是文本也可以是二进制数据。而且没有同源策略的限制,不存在跨域问题。协议的标识符就是ws。像https一样如果加密的话就是wxs...
2020-03-30 10:03:24
452
原创 es6---reduce使用
reduce()方法详解及高级技巧reduce()方法可以搞定的东西,for循环,或者forEach方法有时候也可以搞定,那为啥要用reduce()?这个问题,之前我也想过,要说原因还真找不到,唯一能找到的是:通往成功的道路有很多,但是总有一条路是最捷径的,亦或许reduce()逼格更高...1、语法arr.reduce(callback,[initialValue])...
2020-03-11 00:10:31
5565
1
cesium 模型大全 glb 和 gltf 格式
2020-12-25
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人