- 博客(55)
- 资源 (17)
- 收藏
- 关注
RSS订阅
原创 vue---selection下拉级别树选框
npm install --save @riophae/vue-treeselect// import the component import Treeselect from '@riophae/vue-treeselect'// import the styles import '@riophae/vue-treeselect/dist/vue-treeselect.cs...
2020-03-25 23:05:34
642
原创 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
1273
5
原创 websocket ---反向代理解决跨域问题
让websocket 可以在本地调试首先在 测试环境的配置 webpack.dev.config.js 的 plugins 添加；new webpack.DefinePlugin({ 'process.env': { NODE_ENV: '"development"' } }),然后在初始化websocket的时候判断当前环境是开发环境...
2019-08-01 11:02:07
4287
原创 js高级-理解call()的原理
首先,call要a对象使用b对象的方法,那么我们直接在a对象中添加一个新属性存储该方法,再调用a中的该方法,因为是a对象调用,所以方法this指向a对象,obj对象 + 多个参数 , 我们可以调用call()内部的arguments对象,获得所有接收的参数伪数组,去除第一个后,就是之后调给fn的参数数组。问题1: 因为调用call()的函数本身需要接收的参数各有不同,所以实际问题是call()要接收不定个数的参数。如果想利用a对象中的FN1方法去处理b对象中的数据,就可以使用 FN1.call(b);
2024-10-17 01:03:29
536
原创 彻底理解粘性定位 - position: sticky
粘性定位可以被认为是相对定位(position: relative)和固定定位(position: fixed)的混合。元素在跨越特定阈值前为相对定位，之后为固定定位。在 视口滚动到元素 top 距离小于 10px 之前，元素为相对定位。之后，元素将固定在与顶部距离 10px 的位置，直到视口回滚到阈值以下。粘性定位常作用在导航和概览信息(标题，表头，操作栏，底部评论等)上。这样，用户在浏览详细信息时，也能看到信息的概览和做一些操作，给用户带来便捷的使用体验。
2023-11-21 11:27:20
992
原创 js---三元表达式详解
三元表达式是JS中最为常用的快捷判断语句之一。当判断条件成立时，返回结果1，否则返回结果2。这是JS中最为基本的三元表达式形式。以上代码的意思是：当成绩大于90分时，返回字符串'优秀'；当成绩大于等于80分时，返回字符串'良好'；否则返回字符串'不及格'。运行以上代码，输出结果为'良好'。通过以上代码，我们可以看到三元表达式的嵌套应用，其思想类似于if-else语句的嵌套判断。同时，三元表达式也能够完成复杂的条件判断。
2023-11-17 10:47:26
6784
原创 变量提升的常见情况总结
把当前上下文中带有var(提升声明)/function(提升声明+定义)进行提升的声明或者定义。变量提升是将变量声明提升到它所在作用域的最开始的部分。window。
2023-10-10 18:33:15
972
原创 js----箭头函数的this指向详解
这篇文章主要给大家介绍了关JS 箭头函数的this指向，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧。fun2第一层执行的时候没有打印代码，而是返回了一个函数出来，赋值给f2，并且这里发生了绑定丢失，this指向由原来的obj指向了window(发生了赋值)在字面量中直接定义的箭头函数无法继承该对象的this，而是往外再找一层，就找到了window，因为字面量对象无法形成自己的一层作用域，但是构造函数可以哦。
2023-10-07 17:54:51
236
原创 TypeScript 非空断言
在上下文中当类型检查器无法断定类型时，一个新的后缀表达式操作符!可以用于断言操作对象是非 null 和非undefined 类型。具体而言，x!将从 x 值域中排除null和undefined。下面我们来介绍一下非空断言操作符的一些使用场景和注意事项。
2023-08-10 16:02:00
1416
原创 Vue3.2 setup语法糖
起初Vue3.0版本变量和方法都是要return出来才可以使用，很不友好。在Vue3.2版本推出了 `setup` 语法糖之后，属性和方法都不需要 return 出去了，组件也不需要注册就可以直接使用了，下面慢慢来介绍。
2023-03-23 18:12:10
301
原创 vuex----的辅助函数mapState, mapActions, mapMutations用法和混入
关注IP属地: 江苏2022.03.28 00:14:13字数 287阅读 469。
2022-12-17 10:21:40
664
原创 观察者模式VS发布订阅模式区别
比如发布者发布了很多消息，但是不想所有的订阅者都接收到，就可以在调度中心做一些处理，类似于权限控制之类的。观察者模式： 观察者（Observer）直接订阅（Subscribe）主题（Subject），而当主题被激活的时候，会触发（Fire Event）观察者里的事件。以意图来分辨模式，都是实现了对象间的一种一对多的依赖关系，当一个对象的状态发生改变时，所有依赖于它的对象都将得到通知，并自动更新，那么他们就是同一种模式；观察者模式由具体目标调度，每个被订阅的目标里面都需要有对观察者的处理，会造成代码的冗余。
2022-12-02 14:09:58
2581
原创 js---常用的源码
1.函数柯里化函数柯里化的是一个为多参函数实现递归降解的方式。其实现的核心是:要思考如何缓存每一次传入的参数传入的参数和目标函数的入参做比较这里通过闭包的方式缓存参数，实现如下：使用方式如下：函数柯里化仅仅只是上面求和的这种运用吗？？这个问题，有必要去一下。其实利用函数柯里化这种思想，我们可以更好的实现函数的封装。就比如有监听某一事件那么就会有移除该事件的操作，那么就可以利用柯里化的思想去封装代码了。或者说一个输入 A 有唯一并且对应的输出 B，那么从更大的角度去思想这样
2022-04-19 17:45:27
1566
原创 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
1916
3
原创 vue----动态表单验证
vue+element 动态表单验证公司最近的项目有个添加动态表单的需求，总结一下我在表单验证上遇到的一些坑。如图是功能的需求，这个功能挺好实现的，但是表单验证真是耗费了我一些功夫。vue+element在表单验证上有一些限制，必须依照element示例的格式才能验证通过。附上代码：<el-form :model="dynamicValidateForm" ref="dynamicValidateForm" label-width="100px" class="demo.
2022-02-17 17:56:39
1908
原创 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
822
原创 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
318
原创 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
1464
1
原创 vuex 模块化之后如何调用其他模块的方法和属性
vuex 模块化之后如何调用其他模块的方法和属性vuex的使用场景多处需要更改同一个数据时，需要使用vuex举个例子：购物车商品数量，在商品列表页面添加商品会更改这个值，在详情页增减商品数量会更改这个值，进入购物车删除商品也会更改这个值，通过提交mutation来更改这个值就很简单明了，如果每次都调用获取购物车数量的接口(前提得有),也能实现,但是每一次的HTTP请求,都是对浏览器性能消耗。跨组件共享数据、跨页面共享数据比如loading状态，在很多页面都需要使用vuex 模块.
2021-07-16 16:29:10
2995
原创 cesium 学习笔记
Cesium简介Cesium是一个基于JavaScript的开源框架，可用于在浏览器中绘制3D的地球，并在其上绘制地图（支持多种格式的瓦片服务），该框架不需要任何插件支持，但是浏览器必须支持WebGL。Cesium支持多种数据可视化方式，可以绘制各种几何图形、导入图片，甚至3D模型。同时，Cesium还支持基于时间轴的动态数据展示，例如，我们可以用它绘制卫星运行轨迹。Cesium HelloWorld下面的例子在浏览器中显示一个太空背景、具有地图覆盖的3D地球：index.htmlX
2021-06-30 17:44:20
2279
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
3776
原创 js---继承6种方式
js继承的6种方式想要继承，就必须要提供个父类（继承谁，提供继承的属性） 一、原型链继承 重点：让新实例的原型等于父类的实例。 特点：1、实例可继承的属性有：实例的构造函数的属性，父类构造函数属性，父类原型的属性。（新实例不会继承父类实例的属性！） 缺点：1、新实例无法向父类构造函数传参。 2、继承单一。 3、所有新实例都会共享父类实例的属性。（原型上的属性是共享的，一个实例修改了原型属性，另一个实例的原型属性也会被修改！）.
2021-04-08 16:46:32
107
原创 element中 仿$confirm 确认框
前端交互中经常使用确认框。在删除、修改等操作时，调用后端接口之前，先跳出弹框显示提示信息，提示用户确认，避免用户误操作。项目中全局引入了Element UI，提供了一套模态对话框组件，用于消息提示、确认消息、提交内容，使用起来也非常简便。（什么是“模态”？可将其理解为：特定条件触发之后产生的）以下来自于element官网文档：如果你完整引入了 Element，它会为Vue.prototype添加如下全局方法：$msgbox,$alert,$confirm和$prompt。因此在Vue ...
2021-01-13 19:31:38
5383
原创 连接两个div的直线，拖动时保持连线
连接两个div的直线，拖动时保持连线。效果：连接两个div带箭头的虚线，拖动div时保持线条实时改变位置保持始终连接效果图：1.产品经理提出的需求用带箭头的虚线将两个位置不固定的div连接起来,初听到这个需求一头雾水，传统的div可以做直线，但斜起来不太好做，幸亏之前接触过svg,里面有一个line标签，知道起始中止两个点的位置，就可以将两个点连接起来了。至于箭头,可以这么做先定义箭头： <svg> <defs>
2020-12-26 21:33:33
2498
3
原创 Cesium学习笔记
Cesium学习笔记Cesium是一个基于JavaScript的开源框架，可用于在浏览器中绘制3D的地球，并在其上绘制地图（支持多种格式的瓦片服务），该框架不需要任何插件支持，但是浏览器必须支持WebGL。Cesium支持多种数据可视化方式，可以绘制各种几何图形、导入图片，甚至3D模型。同时，Cesium还支持基于时间轴的动态数据展示，例如，我们可以用它绘制卫星运行轨迹。Cesium HelloWorld下面的例子在浏览器中显示一个太空背景、具有地图覆盖的3D地球： 1 2
2020-12-11 16:33:00
821
原创 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
1789
原创 js---数组和树结构相互转换
数组转树结构采取递归和非递归两种方式，树结构转扁平化数组采取深度优先遍历（递归和非递归两种方式）和广度优先遍历实现。let arr =[ {id:2,name:'部门B',parentId:0}, {id:3,name:'部门C',parentId:1}, {id:1,name:'部门A',parentId:2}, {id:4,name:'部门D',parentId:1}, {id:5,name:'部门E',parentId:2}, {id:6,name
2020-09-10 14:40:01
420
Snipaste 一键订图软件
2020-12-26
cesium 模型大全 glb 和 gltf 格式
2020-12-25
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人