- 博客(102)
- 收藏
- 关注
RSS订阅原创 uniapp引用第三方组件样式无法穿透
在通过uniapp编写小程序过程中发现，引用第三方组件库的样式无法穿透修改。微信小程序文档也给出对应的解决思路。
2024-05-12 23:20:10
426
原创 如何用JS校验HTTP和HTTPS地址
在日常开发过程中，我们有时候对某些应用功能进行封装，但是在请求接口又不能写死，这个时候我们需要对他进行多方面考虑。
2024-04-21 21:36:13
516
转载 JavaScript的新特性
新特性的引入总是带来了新的编程范式和工具，我们可以利用它们来提升我们的开发效率和代码质量。随着新特性逐步融入我们的日常工作，我们需要保持学习的态度，不断适应和采纳这些新工具。尽管如此，我们也要考虑到项目的现实需求，如浏览器兼容性和团队的熟悉度，以确保新特性的引入不会对项目造成负面影响。最终，合理利用现代JavaScript特性，我们能够编写出更加现代化、高效且可维护的前端代码。
2024-04-14 20:42:03
28
原创 详解Vue3中如何使用动态组件
在 Vue 3 中,动态组件是一种允许在运行时动态切换组件的机制,本文主要为大家详细介绍了动态组件在Vue3中的具体使用。Vue 3 提供了 元素以及 is 特性来实现动态组件的切换。
2024-04-09 09:40:05
392
原创 Cesium实现渐变面
使用着色器，通过纹理坐标和其他参数计算出材质的颜色和透明度。通过给定的颜色、漫反射强度和透明度，计算出最终的反射颜色和透明度，并且根据给定的中心点位置和当前像素的纹理坐标，计算出距离中心的距离用来做透明度的参考值，然后计算得到的颜色加载到对应的材质上。
2024-03-31 20:58:40
678
2
原创 VUE父子组件生命周期执行顺序
一、父子组件异步传值的坑子组件的生命周期只会执行一次，但是当子组件渲染的时候父组件的数据还没接受完就会造成子组件没有任何内容渲染。二、解决父子组件异步传值的方法1. 给子组件添加渲染条件，使用v-if，当父组件数据接收完毕后在渲染子组件。2. 在子组件中添加watch监听，当父组件数据传输过来时，改变原有的默认数据，重新渲染页。
2024-03-24 21:52:40
300
翻译 vue3的＜script setup＞是干啥的？
在这种情况下，你可以在同一文件中使用 <script setup> 和<script>标签，将主要的逻辑放在 <script setup>中，而将额外的逻辑或 API 放在。这些选项需要在 <script setup> 外部的 <script> 标签中定义，或者使用特定的语法在<script setup>内部定义。使用 <script setup>，你可以在一个地方同时编写组件的逻辑和模板，而不需要像传统的 Options API 那样在不同的地方分别编写。关键字：在<script setup> 中，
2024-03-10 20:38:15
135
原创 Nginx最常用的指令
包含请求参数的原始URI，不包含主机名，如：/foo/bar.php?不带请求参数的当前URI，$uri不包含主机名，如 /foo/bar.html。当前请求的文件路径，由 root 或alias指令与URI请求生成。这个变量等于请求行中的参数，同 $query_string。请求使用的协议，通常是HTTP/1.0或HTTP/1.1。请求头中的 Content-length 字段。客户端请求的动作，如 GET/POST。当前请求在 root 指令中指定的值。有服务器宕机，标记的机器接收请求。
2024-03-03 21:39:21
895
转载 vue3定时刷新
业务场景：某个模块有多处数据刷新处理，为了减少或setTimeout线程的消耗，统一使用一个定时器，然后结合watch监听实现刷新同步，更具体的可以再结合各个接口的请求时间来判定是否刷新。
2024-02-25 20:24:03
259
原创 cavas自适应父元素宽高
canvas的默认宽高为300px*150px，在css中设置canvas的宽高，实际上是把canvas在300px*150px的基础上进行了拉伸。所以绘制出来的图像会发生变形。我们在使用cavas画布的过程中，有时候需要修改他的宽高，但是如果通过css样式去修改，有个弊端，就是显示内容比较模糊，为此需要让他的宽高自适应父元素宽高。
2024-01-28 20:12:44
672
原创 cesium实现动态围栏
在网上也找了好多案例，通过着色器来实现效果，为此也有好多博主也附上了自己的代码，也许是因为使用方法不同，复制代码并修改依旧还是没有通过他们的方式实现效果【着色器】。我这里先附上我的代码，便于跟我一样的，第一接触cesium的人，解决当下的需求。项目中使用到了cesium,需要实现动态的围栏的效果，
2024-01-21 22:39:47
523
原创 vue结合Cesium加载gltf模型
Cesium支持的格式包括：3D模型格式（如COLLADA、gITF、OBJ）、影像格式（如JPEG、PNG、GeoTIFF）、地形格式（如STL、Heightmap）、矢量数据格式（如GeoJSON、KMZ）、时间动态数据格式（如CZML），以及其他各种数据格式。此外，Cesium还通过插件支持其他特定格式。
2024-01-07 21:19:15
720
原创 cesium实现天气效果【雨、雪、雾】
项目中使用到cesium,为了让立体效果更好看，更应景，为此里面也涉及到了天气效果，其实网上也有一大堆，我也只是其中的一个复制者，唯一不同的是可以通过来改变雨雪的大小等等。
2024-01-01 21:47:35
1401
2
原创 cesium实现区域贴图及加载多个gif动图
贴图，如果能够将gif动图进行解析，获得时间序列对应的每帧图片，然后按照时间序列动态更新Billboard的纹理，即可实现动图纹理效果。为此也找到了相对于好一点的第三方库。能够将gif转化为一帧帧图像，正好能够满足我们的需求！Cesium的Billboard支持单帧。2、cesium加载geoJSON并贴图。
2023-12-24 19:21:56
958
原创 WebSocket与JavaScript：实现实时获取位置
WebSocket是一种在单个TCP连接上进行全双工通信的协议。与传统的HTTP请求相比，WebSocket能够在服务器和客户端之间建立持久连接，实现实时数据传输。WebSocket提供了较低的延迟和高效的数据传输。在实时舆情监测中，它能够实时接收舆情数据，并将数据传送给前端进行处理。WebSocket与JavaScript的结合应用在实时位置中扮演了重要的角色。WebSocket作为一种实时通信协议，能够实现服务器与客户端的双向实时通信。
2023-12-17 20:46:58
198
原创 vue3+vite动态路由的实现方式
根据返回的路由信息，加载相应的路由页面，不会在前端暴露所有的路由信息。缺点在于每个用户的路由配置相较于第一种更为繁琐，并且增加了服务器查找路由的负担。进行前端的路由控制。缺点在于每个用户都可以看到页面的所有路由信息，此时则需要后端单独对接口设置不同的角色权限。对于第一种方法，其优点在于不用后端单独配置路由信息，当用户登陆时可直接根据用户的。在vue项目要想实现路由的动态控制，有两种主流的实现方向。方法，主要用于递归后端返回的路由信息，并对组件进行加载，方法，主要用于对不同角色的用户进行首页的不同重定向。
2023-12-10 18:33:27
742
原创 Vue3中teleport如何使用
Vue 3中的Teleport允许开发者将组件的内容渲染到DOM树中的不同位置，实现了组件内容在组件层次结构之外的渲染。类似于React中的Portal，Teleport可以用于实现Portal技术，将组件渲染到DOM树中的不同位置，实现更高级的组件渲染控制。在需要显示提示信息的地方，使用Teleport将Tooltip组件的内容传送到指定位置，实现在全局范围内的提示。Teleport使得弹窗组件可以脱离组件层次，直接渲染到页面的任何位置，而不受组件嵌套的限制。在组件渲染时，teleport。
2023-12-03 18:10:54
548
翻译 Vue3中后台动态路由 + 侧边栏渲染方案
B端项目通过动态路由实现角色鉴权，已经是一个非常成熟的方案，无论是使用“加法方案”实现，还是使用“减法方案”，都是可行的，理论上都是对权限的一次递归筛选。大家主要根据项目规模、要求合理选择最适合的方案，在安全、便捷、开发难度、稳定性，等多角度做好权衡利弊。
2023-11-26 19:04:35
759
转载 VUE3组合式API，这样写最优雅
官方解释：组合式 API (Composition API) 是一系列 API 的集合，使我们可以使用函数而不是声明选项的方式书写 Vue 组件。这里可以学习到vue3组合式api的优秀项目案例，项目是vue社区成员构建的，值得学习和借鉴，助力vue3能力提升和培养。：例如 provide() 和 inject()，使我们可以在使用响应式 API 时，利用 Vue 的依赖注入系统。vue2推荐选项式api，vue3推荐组合式api，不做定论，适合开发者的写法就是最好的。
2023-11-19 19:53:49
358
原创 cesium如何实现区域下钻
里的数据，这里整合了一下之前发的区域高亮的代码来实现的，单击左键使得区域高亮，每次点击都移除上一次点击的模块，双击左键，实现区域下钻并请求对应的数据源，单击右键来实现恢复上一层级。注：如有问题或者有更好的解决方式可以联系笔者，进行解答及优化。首先，这里讲一下数据源，数据源是拷贝的。
2023-11-12 16:23:19
421
转载 一次性搞清楚Blob、File、FileReader、ArrayBuffer、Base64
Blob全名是() 翻译过来就是二进制类型的大对象Blob对象表示一个不可变、原始数据的类文件对象，一个Blob对象就是一个包含有只读原始数据的类文件对象。Blob对象中的数据并不一定得是js中的原生形式。File接口基于Blob，继承了Blob的功能,并且扩展支持了用户计算机上的本地文件。它的存在，允许我们可以通过JS直接操作二进制数据。还可以通过Blob设置二进制数据的MIME类型。
2023-10-29 19:47:35
156
原创 vue3结合Cesium加载倾斜摄影3dtiles
这篇文章主要是为了记录加载3dtiles时模型与地形有时候存在一些高度上的差异，为此将解决方法做一个记录，便于其他读者使用。
2023-10-22 19:50:12
1041
原创 vue清除动态路由
查看vue-router路由文档 可以看出 Vue2中是通过matcher来进行重新赋值来进行清空的。而Vue3中没有关于matcher这个属性，这样一来，就需要自己通过循环遍历来清除路由，
2023-10-15 19:46:41
2518
1
原创 前端性能优化
性能优化这个问题，在面试的过程中问道的概率还挺大的，特别是对有前端开发经验的面试者来说，基本会被面试官问道关于性能优化的问题。但是在我们做项目的过程中，可能业务比较简单，并没有复杂到需要专门去优化的程度，复杂的业务呢，可能也优化不动。在被问到时可能会被问住（根本不需要优化......）。但是性能优化确实是值得关注的问题，并不是业务复杂到某种程度才去专门做优化。我觉得在平时的编码过程中有良好的习惯，时刻想着怎么写能更好一点，也能达到一种优化的作用。
2023-09-17 20:28:08
182
转载 vue3 的数据请求部分放在哪里最合适
在需要访问数据的组件中，使用计算属性或映射辅助函数来获取并展示数据。：如果你的数据请求逻辑较为复杂，并且多个组件可能会共享相同的数据请求，可以创建一个单独的服务类或模块来处理数据请求。：如果你的数据请求仅与单个组件相关，并且不需要在其他组件中共享，可以将数据请求代码放在组件的生命周期钩子函数（如。使用现代的异步请求库（如 Axios 或 Fetch API）来发送请求，并在请求成功后更新组件的数据。你可以根据自己的需求，在Store中定义需要的状态和操作方法，然后在组件中引入并使用Store实例即可。
2023-09-10 20:26:53
1079
转载 vue+cesium加载3dtiles模型内存消耗很大
关于通过谷歌浏览器通过Cesium底层添加实景三维都会存在，谷歌浏览器内存回收机制，这个问题官方一直没有解决了。我可以根据一些参数进行调整一下，我这套方案，本人亲测有效，加载模型速度快，而且当你相机视角达到某个高度的时候或者移走的时候，他会自动回收，一点不占内存。
2023-09-03 20:27:16
1159
转载 uniapp简单页面操作：创建与跳转
在页面目录（pages），鼠标右键点击,即可进入新建页面面板。详细界面如下：页面创建成功后，会自动创建页面信息到页面配置文件。
2023-08-27 19:31:04
426
转载 Cesium轨迹漫游及视角切换
飞行漫游，就是让Camera飞行。Camera有一些方法可以实现位置、视角的调整，比如flyTo，setView方法。但这些方法并不能沿着我们想要的路径调整，在通过插值的方法不停的调用setView，但这样会造成视图卡顿，而且计算起来也很麻烦。所以我们最好是借助entity，通过跟踪运动中的entity就可以实现Camera的飞行了。刚开始的时候，以为官方会有类似于 viewer.trackedEntity = entity;的方法来实现第一人称视角，结果找半天并没有发现。
2023-08-20 17:20:32
1885
3
转载 flv.js在vue中使用
flv.js是一个用于在浏览器中解码和播放FLV视频的JavaScript库。它可以将FLV视频流解码并显示在HTML5的video元素中，从而实现在浏览器中直接播放FLV格式的视频文件。
2023-08-13 20:35:23
1458
原创 javaScript 如何获取对象中非空的属性
要获取JavaScript对象中所有具有值的属性，您可以使用 Object.entries()方法结合Array.prototype.filter()方法。在上述示例中，我们定义了一个带有多个属性的对象obj。其中，city属性的值为空字符串。使用可以将一个对象转换为包含的数组。每个键值对都是由键和值组成的数组，如。接下来，我们使用.filter()方法对键值对数组进行过滤。我们检查每个键值对中的值value是否为空字符串（），从而筛选出具有值的属性。最后，我们使用.map()
2023-07-30 21:44:09
303
转载 JavaScript基础篇（1~10题）
*事件代理 ( Event Delegation )**， ⼜称之为事件委托。是 JavaScript 中常用绑定事 件的常用技巧。顾名思义，“事件代理”即是把原本需要绑定的事件委托给父元素，让父元素担当事件监听的职务。事件代理的原理是DOM元素的事件冒泡。使用事件代理的好处是 可以提高性能可以大量节省内存占用，减少事件注册， 比如在 table 上代理所有 td 的 click 事件就 非常棒可以实现当新增子对象时无需再次对其绑定事件代理示例。
2023-07-23 20:53:21
73
原创 vue-cesium的基本使用【一】
最近的项目中用到了cesium,也了解了一点关于cesium的知识，打点、 标绘、等等基础的功能点，但是在开发过程中使用原生的cesium编写对于初学者还是有点难度，为此，找到关于对cesium进行二次封装的开源项目,本次文章主要记录对vue-cesium的使用方式。# npm# yarn# pnpm其他方式就不在这里演示了，自行查看官网。
2023-07-16 21:35:26
496
原创 【ES6】中构造函数的语法糖 —— Class（类）
在JavaScript中，class是创建对象的一种方式，它定义了一个类的模板，包含了属性和方法的声明，在底层中仍然是使用原型和基于原型的继承。
2023-07-09 21:06:41
899
转载 async/await到底要不要加try catch?
几种写法，初看可能觉得第三种 catch 这种写法是最好的，但是细想下，从用户体验上来看，我觉得 try catch 是最好的，逻辑直观、符合同步编程思维，控制台不会暴露。
2023-06-11 19:07:55
93
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人