- 博客(62)
- 收藏
- 关注
RSS订阅原创 vue3 命名式（函数式）弹窗
什么是命令式（也可以称为函数式）弹窗呢？通常我们在vue的开发中想要使用弹窗，会先在中定义好元素，然后利用变量来控制dialog的显示隐藏，这种属于声明式弹窗。但是在一些场景中，比如我们封装的一些工具函数、hooks、插件等中没办法像在单文件组件中一样将dialog写到template中，或者一些公共的弹窗使用声明式弹窗会比较臃肿，这个时候命名式的调起弹窗就派上用场了。
2024-11-24 22:17:49
1034
原创 前端excel的实现方案Luckysheet
Luckysheet是一款纯前端类似excel的在线表格，功能强大、配置简单、完全开源的插件。目前已暂停维护，但是其已有功能大概能满足常见需求的使用。
2024-10-13 23:29:21
2313
原创 Vue项目中通过插件pxtorem实现大屏响应式
因为设计图一般是给一个固定的尺寸，所有元素都统一以px为单位提供，所以一般情况下我们为了尽可能还原设计图，都一一对应地按同样的数值去实现页面，最后为了高效率自动化地将对应的px都转化为rem，所以我们必须使用这款插件。rem单位代表的是根节点的font-size大小，所以当我们在页面上使用rem去替代px的时候，就可以通过修改根节点font-size的值，动态地让页面上的元素根据不同浏览器宽高下去实现变化。作用：根据浏览器的可视窗口大小，动态地去设置根节点font-size的值，也就是rem的基准值。
2024-10-06 12:16:52
693
原创 openlayers中一些问题的解决方案
添加地图元素需要分四步走，第一步是生成图层（点位元素的容器），第二步生成点位，第三步声明style（即点位的样式信息，例如点位图片、位置等），第四步将点位加入图层。通常情况下，我们可以在html代码中先声明好弹出层的组成结构和样式，然后再将其与overlay对象绑定，从而即可达到理想中的效果。若需要与地图交互时触发相关事件，需要添加对应的监听方法，常用的有点击监听、鼠标移动监听等事件。②点击事件：常与弹出层搭配使用，点击对应矢量，弹出相关信息。1、定位：需要将地图的中心视野，定位到研究区域的中心点；
2024-09-23 12:37:20
845
原创 前端滚动分页
而当我们在移动端中，分页组件就显得有点不符合逻辑和正常的交互体验，所以滚动分页常常成为我们的一种选择，即页面滚动到底部时才能加载更多数据，以免一次加载太多数据造成性能问题。因此需要将滚动分页做成可复用易维护的模块，以提高效率。使用了窗口的滚动事件会对浏览器或者程序运行载体有一定的性能影响，如果导致页面卡顿的情况，我们可以通过使用防抖和节流，减少对页面滚动的监听频率。1、常规的实现方案，监听滚动事件，判断页面滚动距离和窗口大小，距离顶部位置的高度，根据判断生成下一组数据并插入，直至数据量为空。
2023-11-05 22:25:33
995
原创 关于Babylon.js的一些了解
谈到babylon.js就不得不提到three.js。在3D Web开发领域，Babylon.js和Three.js被视为两种最流行的JavaScript库，用于创建引人入胜的3D体验。它们都提供了强大的功能和活跃的社区，但它们具有不同的优点和缺点。在这篇综合比较中，我们将深入探讨Babylon.js和Three.js之间的核心差异。Babylon.js和Three.js都是JavaScript库，可以让开发者在浏览器中创建3D图形和交互式Web体验。
2023-10-29 21:29:13
720
原创 localforage-本地存储的优化方案
前端本地化存储算是一个老生常谈的话题了，我们对于 cookies、Web Storage（sessionStorage、localStorage）的使用已经非常熟悉，在面试与实际操作之中也会经常遇到相关的问题，但这些本地化存储的方式还存在一些缺陷，比较明显的缺点如下：存储量小：即使是web storage的存储量最大也只有 5M存取不方便：存入的内容会经过序列化，当存入非字符串的时候，取值的时候需要通过反序列化。
2023-10-22 21:06:51
640
原创 JS数组方法总结
接收两个参数，第一个为回调函数，回调函数有四个参数，第一个参数为上一次回调函数return的结果，首次默认为第二个参数值，如果没有第二个参数值，则默认当前数组下标为0的参数，第二个参数为当前元素，第三个为当前索引值，第四个为数组本身，reduce的第二个参数指定一个默认值，可选。可以选择删除数组中的某一个值，也可以在数组中的某个位置添加一些数据，接收可选参数，三个或以上的参数，第一个为截取的索引位置number类型，第二个截取的个数number类型，第三个或更多实在截取位置添加的参数，可以是任何类型。
2023-10-15 21:30:29
194
原创 Vue项目中可能存在的问题和解决方案
相比其他的框架来说，Vue中更容易产出不合格代码；因为Vue中的options就是一个大对象，导致js本身的很多检测都失效了，比如一个函数没有用到的话会“变灰”，template中代码提示比较少，较多的mixins等等；遇到不合格代码，大多数人第一反应就是这谁写的代码这么差，其实大多数公司大多数人至少曾经都写过一些不合格代码，有不合格代码很正常，问题在于怎么快速梳理出业务逻辑，防止在迭代新需求时引发bug，在富有余力的情况下可以进行局部重构，渐进式优化屎山代码；
2023-09-17 22:00:56
623
1
原创 Vue3的新特性总结
首先，Vue3 新增了一个叫做组合式 api 的东西，英文名叫 Composition API。因此 Vue3 的 script 现在支持三种写法。
2023-09-10 18:48:50
551
1
原创 CSS中的一些强大的属性和实用技巧
不知道大家平时业务开发中有没有碰到像上图一样的吸顶的需求：标题在滚动的时候，会一直贴着最顶上。这种场景实际上很多：比如表格的标题栏、网站的导航栏、手机通讯录的人名首字母标题等等。如果让大家自己动手做的话，是不是会用 js 结合 css 来实现呢？以前确实是这样的，直到后来 position 属性新增了一个属性值 sticky ，前端程序员才迎来了小春天。</</</</</
2023-09-03 20:19:30
159
原创 Vue状态管理之Pinia
Pinia 是 Vue 的存储库，它允许您跨组件/页面共享状态。如果您熟悉 Composition API，您可能会认为您已经可以通过一个简单的 export const state = reactive({}). 这对于单页应用程序来说是正确的，但如果它是服务器端呈现的，会使您的应用程序暴露于安全漏洞。简洁而强大的 API：Pinia.js 提供简洁而强大的 API，使得状态管理变得更加直观和易于理解。它采用类似于 Vuex 的概念，通过定义和使用 store 实例进行状态的管理和共享。
2023-08-27 22:37:42
237
原创 关于Cesium的常见需求整理之点位和弹窗（点位弹窗）
①在Cesium中，每个自定义的地图元素被视为一个entity对象，如果我们要添加点位到地图上，那就必须先创建一个entity对象。以上代码我们创建了一个entity对象，只需要给予一个坐标参数就可以创建成功。②但是，仅仅只是一个坐标点在一般情况下是没办法满足我们的需求的，大多数时候我们都需要为我们的点位添加一个icon图标或者点位作为指示。这里就需要用到它另外一个参数，billboard。③有时候我们还想在点位图标下方添加简短的文本名称，这个时候可以使用label这个参数④至此，常用的点位设置已经完
2023-08-13 19:56:19
4594
23
原创 前端中的浅拷贝和深拷贝
JS的浅拷贝与深拷贝主要是作用于多层级数组或对象中。浅拷贝是只复制创建数组或对象的第一层，其他层级和原数组或对象拥有相同地址值，因此修改浅拷贝的数组或对象的深层的数值就会影响原数组或对象的值。而深拷贝则是拷贝一个全新的数组或对象，每一个层级都在堆内存中开辟了新的空间，和原数组或对象相互不影响。
2023-07-30 23:37:15
441
原创 关于vue3为何要使用Vite，什么是vite
vite是新一代前端构建工具，能够显著提升前端开发体验。他是使用rollup打包你的代码，是开箱即用的，同时也提供了丰富的插件api,带来了高度的可扩展性。可以构建vue，react 等项目。
2023-07-23 23:15:51
4040
原创 如何在苹果商店发布App？
众所周知，苹果对于自家产品的安全问题十分重视，他们有严格的一套审核标准和流程，当我们想要在苹果商店发布一款App的时候就需要经过重重艰难险阻，克服不少繁杂的问题去完成这项工作。另外有一点需要注意的是，发布苹果App需要一个苹果开发者账号，年费￥688，首先请准备好该账号后才可以发布，同时以下讲解是基于mac环境下的发布，没有mac环境无法将app打包文件-ipa文件上传到商店管理中心。讲到这里可以得出，需要以下这些条件才可以发布App：①Ipa文件②mac环境（或者第三方上传ipa平台）
2023-07-09 22:47:09
560
原创 如何在小程序中引入使用vant框架
在微信小程序的原生组件较少的背景下，通常我们在开发微信小程序的时候则往往会使用该框架作为主体的UI框架进行开发，省时省力，大大缩短了开发的周期。由于小程序的环境和普通的Vue项目大不相同，所以想要在小程序中引入vant框架并不能直接用npm去直接构建，它稍微会更麻烦些，所以接下来的内容会详细介绍一下如何在微信小程序中引入使用Vant。关于这个文件的修改，主要是看我们用的小程序模板，不同模板生成的文件目录不一样，新版的一些模板目录可能会导致小程序找不到我们的npm包位置，所以需要对这个文件做一些调整。
2023-07-01 22:02:02
10547
6
原创 在Vue项目中使用openlayers开发GIS项目
说起点位不得不提到feature对象,feature可以理解成是我们自定义在地图上添加的元素,所以要把点位信息赋予给feature,然后再把feature添加到地图上。地图的初始化完成后，它只是一个具备了地图API的容器，在页面上的显示依然是一片空白，这个时候我们就需要为它添加图层，展示我们所需要的地图，这里以天地图图层作为例子。地图上添加了各种各样的元素之后,我们还想要能够地图根据我们的反馈,给我们展示对应的信息,此时需要添加可以跟地图交互的代码。
2023-06-25 22:05:53
1614
原创 如何正确地使用ES6提高我们的代码质量（二）
有时候我们要把某个变量的传到对象中，总是声明重复含义的变量名，这样对代码阅读性会产生一定的影响，用以下这种方式即可避免。通过这样的方式可以把一个已经存在的对象在声明新变量的时候展开，从而构建出一个全新的，符合我们需要的对象。深度解构，跟前面的一个例子是一样的，这里与函数的默认参数结合，实现了更好的默认对象参数的声明方式。等同于削弱了apply的作用，减少一些不太便捷的方式，新增了一种更新更优的解决方案。这个API可以根据数组对象中参数的值为条件，提取符合条件的对象元素。多层解构，层层嵌套。
2023-06-18 20:24:06
241
原创 如何正确地使用ES6提高我们的代码质量
相信每个前端工程师，或者了解前端的人都知道ES6。它是js的一次巨变，它为我们开发js前端项目的时候带来了许多更好的去书写代码的方式。但是很多时候我们可能都没有过度地去关注优化代码这一块内容，哪怕有也只是注意到了一些比较大众化，比较常见的东西，比如let和const、箭头函数、解构赋值……。这一篇文章将会简单直观，清晰明了地阐述ES6的一些变革和它们的真正使用方式。
2023-05-28 21:25:14
442
原创 前端开发必备知识点杂谈
①解析 URL，判断是否命中缓存（DNS prefetch）②访问 DNS 服务器，将域名解析获取 IP 地址③三次握手建立 TCP 连接④发送 HTTP 请求⑤服务器处理请求并返回 HTTP 报文⑥浏览器解析渲染页面⑦断开连接：TCP 四次挥手。
2023-05-21 12:25:53
1034
原创 微信小程序开发总结
以上是对小程序开发的一个简单的总结，小程序对于一个掌握编程框架，尤其是Vue的编程师来说其实是相对简单的，很多的开发习惯我们都可以按照平时开发Vue的时候继续保持，就像写一个移动端浏览器应用即可。重点是要熟悉小程序的配置文件和一些Api，这样就能很快掌握小程序的开发。
2023-03-19 21:21:46
378
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人