- 博客(112)
- 收藏
- 关注
RSS订阅原创 鸿蒙关于可以实现滚动效果的容器组件的相关知识
在开发的过程中，用户在使用app的过程中对于滚动条样式审美的提升，不断向开发人员提出建议，开发人员不得不改变滚动条样式。通过使用ScrollBar组件（需要和Grid公用同一个Scroller）来自定义样式。Grid的属性属性名类型说明scrollBarBarState设置滚动条状态。默认值：BarState.autoBarState.off 关闭BarState.on 常驻BarState.auto 按需显示设置滚动条的颜色。设置滚动条的宽度。
2024-08-18 21:17:21
841
原创 Vue自定义指令
在 Vue，除了核心功能默认内置的指令 ( v-model 和 v-show )，Vue 也允许注册自定义指令。它的作用价值在于当开发人员在某些场景下需要对普通 DOM 元素进行操作。Vue自定义指令有全局注册和局部注册两种方式。先来看看注册全局指令的方式，通过方式注册全局指令。然后在入口文件中进行Vue.use()调用。批量注册指令，新建文件在main.js引入并调用下面分享几个实用的 Vue 自定义指令v-copyv-debouncev-emojiv-LazyLoad。
2024-08-11 21:45:04
947
原创 DevEso Studio的使用试题
3. DevEco Studio支持使用多种语言进行应用/服务的开发，包括ArkTS、JS和C/C++。2. module.json5文件中的deviceTypes字段中，配置了phone，tablet，2in1等多种设备类型，才能进行多设备预览。1. 如果代码中涉及到一些网络、数据库、传感器等功能的开发，均可使用预览器进行预览。1. 用哪一种装饰器修饰的组件可作为页面入口组件：（@Entry）4. 组件预览通过在组件前添加下面哪个注解： (@Preview)
2024-08-02 17:45:56
218
转载 深度选择器探秘：/deep/、＞＞＞、::v-deep 与 v-deep() 的区别与用法
深度选择器允许我们从父组件中穿透到子组件内部，直接修改子组件的样式。这在需要定制第三方UI库组件样式时尤为有用。
2024-07-21 19:11:50
170
原创 vitest 单元测试应用与配置
jsdom 是一个在 Node.js 环境中使用的纯 JavaScript 实现的 DOM（文档对象模型），它模拟了足够多的浏览器环境，使得你能够在服务器端（如 Node.js 应用程序）中运行那些原本只能在浏览器中运行的脚本。Vitest的配置可以通过多种方式实现，包括在package.json中直接配置，或者创建一个专门的配置文件（如vitest.config.ts或vitest.config.js）。在你的Vue项目中，你可以为组件、函数、工具等编写测试。你可以根据项目的具体需求来配置这些选项。
2024-07-12 16:44:05
1184
原创 【js基础巩固】深入理解作用域与作用域链
先看一段代码，下面代码输出的结果是什么？当执行到这句代码的时候，其调用栈的状态图如下所示：此时，和foo都包含变量myName，那么bar函数里面的myName值到底该选择哪个呢？myNamefoofoomyNamefoomyName如果按照这种方式来查找变量，那么最终执行bar函数打印出来的结果就应该是“极客邦”。但实际情况并非如此，而是打印“极客时间”。要解释这个问题，就涉及到了。其实在每个执行上下文的中，都包含了一个外部引用，用来指向外部的执行上下文，我们把这个外部引用称为。
2024-07-07 22:01:31
1042
原创 浏览器中如何获取用户网络状态
以下代码是 ahooks 中的 useNetwork 自定义 Hook 实现方式，其核心原理是通过以上的navigator.onLine和navigator.connection中提供的API进行分装的。其他的自定义Hooks也有类似实现的封装。since?: Date;online?: boolean;rtt?: number;type?: string;downlink?: number;saveData?: boolean;: number;: string;if (!
2024-06-30 22:33:35
526
1
原创 vue中provide和inject的使用
vue中组件传值是比较常见的，也是我们日常编写代码最常用到的，这里主要讲讲provide和inject的用法。我是子组件,我获取的内容是 我是DemoTwo级组件的值。
2024-06-23 21:58:42
217
原创 如何判断一个js对象是否存在循环引用
在前端是我们常用的一个方法，可以将一个对象序列化。例如将如下对象序列化我们发现上面对象是可以使用JSON.stringfy序列化的。personowner我们对上面这个对象进行JSON.stringfy,结果如下，会报错：我们发现他说不能转化一个“圈结构体为JSON”,是因为这个对象的owner属性指向了自己。在转化的时候会变成死循环。
2024-06-16 21:24:10
398
转载 前端如何判断上传图片尺寸（宽度和高度）
在上传图片时，存在需要判断图片的宽高是否符合需求的场景（如指定Icon尺寸）。那么前端如何判断上传图片尺寸（宽度和高度）？
2024-06-10 18:16:43
195
转载 BFC是什么？
BFC（Block Formatting Context，块格式化上下文） 是Web页面的可视化CSS渲染的一部分，是块盒子的布局过程发生的区域，也是浮动元素与其他元素交互的区域。详见MDN看不明白？那就对了！官方解释若不搞得抽象难懂些，怎能显出高大上？！（手动滑稽）还是让逆战在新冠疫情期的我来给你解答吧！1、可以利用BFC解决两个相邻元素的上下margin重叠问题；2、可以利用BFC解决高度塌陷问题；3、可以利用BFC实现多栏布局（两栏、三栏、圣杯、双飞翼等）。
2024-05-26 21:12:32
338
原创 uniapp引用第三方组件样式无法穿透
在通过uniapp编写小程序过程中发现，引用第三方组件库的样式无法穿透修改。微信小程序文档也给出对应的解决思路。
2024-05-12 23:20:10
840
原创 如何用JS校验HTTP和HTTPS地址
在日常开发过程中，我们有时候对某些应用功能进行封装，但是在请求接口又不能写死，这个时候我们需要对他进行多方面考虑。
2024-04-21 21:36:13
896
转载 JavaScript的新特性
新特性的引入总是带来了新的编程范式和工具，我们可以利用它们来提升我们的开发效率和代码质量。随着新特性逐步融入我们的日常工作，我们需要保持学习的态度，不断适应和采纳这些新工具。尽管如此，我们也要考虑到项目的现实需求，如浏览器兼容性和团队的熟悉度，以确保新特性的引入不会对项目造成负面影响。最终，合理利用现代JavaScript特性，我们能够编写出更加现代化、高效且可维护的前端代码。
2024-04-14 20:42:03
42
原创 详解Vue3中如何使用动态组件
在 Vue 3 中,动态组件是一种允许在运行时动态切换组件的机制,本文主要为大家详细介绍了动态组件在Vue3中的具体使用。Vue 3 提供了 元素以及 is 特性来实现动态组件的切换。
2024-04-09 09:40:05
1233
原创 Cesium实现渐变面
使用着色器，通过纹理坐标和其他参数计算出材质的颜色和透明度。通过给定的颜色、漫反射强度和透明度，计算出最终的反射颜色和透明度，并且根据给定的中心点位置和当前像素的纹理坐标，计算出距离中心的距离用来做透明度的参考值，然后计算得到的颜色加载到对应的材质上。
2024-03-31 20:58:40
1129
4
原创 VUE父子组件生命周期执行顺序
一、父子组件异步传值的坑子组件的生命周期只会执行一次，但是当子组件渲染的时候父组件的数据还没接受完就会造成子组件没有任何内容渲染。二、解决父子组件异步传值的方法1. 给子组件添加渲染条件，使用v-if，当父组件数据接收完毕后在渲染子组件。2. 在子组件中添加watch监听，当父组件数据传输过来时，改变原有的默认数据，重新渲染页。
2024-03-24 21:52:40
336
翻译 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
219
原创 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
1377
转载 vue3定时刷新
业务场景：某个模块有多处数据刷新处理，为了减少或setTimeout线程的消耗，统一使用一个定时器，然后结合watch监听实现刷新同步，更具体的可以再结合各个接口的请求时间来判定是否刷新。
2024-02-25 20:24:03
489
原创 cavas自适应父元素宽高
canvas的默认宽高为300px*150px，在css中设置canvas的宽高，实际上是把canvas在300px*150px的基础上进行了拉伸。所以绘制出来的图像会发生变形。我们在使用cavas画布的过程中，有时候需要修改他的宽高，但是如果通过css样式去修改，有个弊端，就是显示内容比较模糊，为此需要让他的宽高自适应父元素宽高。
2024-01-28 20:12:44
993
原创 cesium实现动态围栏
在网上也找了好多案例，通过着色器来实现效果，为此也有好多博主也附上了自己的代码，也许是因为使用方法不同，复制代码并修改依旧还是没有通过他们的方式实现效果【着色器】。我这里先附上我的代码，便于跟我一样的，第一接触cesium的人，解决当下的需求。项目中使用到了cesium,需要实现动态的围栏的效果，
2024-01-21 22:39:47
702
原创 vue结合Cesium加载gltf模型
Cesium支持的格式包括：3D模型格式（如COLLADA、gITF、OBJ）、影像格式（如JPEG、PNG、GeoTIFF）、地形格式（如STL、Heightmap）、矢量数据格式（如GeoJSON、KMZ）、时间动态数据格式（如CZML），以及其他各种数据格式。此外，Cesium还通过插件支持其他特定格式。
2024-01-07 21:19:15
915
原创 cesium实现天气效果【雨、雪、雾】
项目中使用到cesium,为了让立体效果更好看，更应景，为此里面也涉及到了天气效果，其实网上也有一大堆，我也只是其中的一个复制者，唯一不同的是可以通过来改变雨雪的大小等等。
2024-01-01 21:47:35
2447
3
原创 cesium实现区域贴图及加载多个gif动图
贴图，如果能够将gif动图进行解析，获得时间序列对应的每帧图片，然后按照时间序列动态更新Billboard的纹理，即可实现动图纹理效果。为此也找到了相对于好一点的第三方库。能够将gif转化为一帧帧图像，正好能够满足我们的需求！Cesium的Billboard支持单帧。2、cesium加载geoJSON并贴图。
2023-12-24 19:21:56
1136
2
原创 WebSocket与JavaScript：实现实时获取位置
WebSocket是一种在单个TCP连接上进行全双工通信的协议。与传统的HTTP请求相比，WebSocket能够在服务器和客户端之间建立持久连接，实现实时数据传输。WebSocket提供了较低的延迟和高效的数据传输。在实时舆情监测中，它能够实时接收舆情数据，并将数据传送给前端进行处理。WebSocket与JavaScript的结合应用在实时位置中扮演了重要的角色。WebSocket作为一种实时通信协议，能够实现服务器与客户端的双向实时通信。
2023-12-17 20:46:58
251
原创 vue3+vite动态路由的实现方式
根据返回的路由信息，加载相应的路由页面，不会在前端暴露所有的路由信息。缺点在于每个用户的路由配置相较于第一种更为繁琐，并且增加了服务器查找路由的负担。进行前端的路由控制。缺点在于每个用户都可以看到页面的所有路由信息，此时则需要后端单独对接口设置不同的角色权限。对于第一种方法，其优点在于不用后端单独配置路由信息，当用户登陆时可直接根据用户的。在vue项目要想实现路由的动态控制，有两种主流的实现方向。方法，主要用于递归后端返回的路由信息，并对组件进行加载，方法，主要用于对不同角色的用户进行首页的不同重定向。
2023-12-10 18:33:27
1032
原创 Vue3中teleport如何使用
Vue 3中的Teleport允许开发者将组件的内容渲染到DOM树中的不同位置，实现了组件内容在组件层次结构之外的渲染。类似于React中的Portal，Teleport可以用于实现Portal技术，将组件渲染到DOM树中的不同位置，实现更高级的组件渲染控制。在需要显示提示信息的地方，使用Teleport将Tooltip组件的内容传送到指定位置，实现在全局范围内的提示。Teleport使得弹窗组件可以脱离组件层次，直接渲染到页面的任何位置，而不受组件嵌套的限制。在组件渲染时，teleport。
2023-12-03 18:10:54
811
翻译 Vue3中后台动态路由 + 侧边栏渲染方案
B端项目通过动态路由实现角色鉴权，已经是一个非常成熟的方案，无论是使用“加法方案”实现，还是使用“减法方案”，都是可行的，理论上都是对权限的一次递归筛选。大家主要根据项目规模、要求合理选择最适合的方案，在安全、便捷、开发难度、稳定性，等多角度做好权衡利弊。
2023-11-26 19:04:35
983
转载 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
725
原创 cesium如何实现区域下钻
里的数据，这里整合了一下之前发的区域高亮的代码来实现的，单击左键使得区域高亮，每次点击都移除上一次点击的模块，双击左键，实现区域下钻并请求对应的数据源，单击右键来实现恢复上一层级。注：如有问题或者有更好的解决方式可以联系笔者，进行解答及优化。首先，这里讲一下数据源，数据源是拷贝的。
2023-11-12 16:23:19
556
转载 一次性搞清楚Blob、File、FileReader、ArrayBuffer、Base64
Blob全名是() 翻译过来就是二进制类型的大对象Blob对象表示一个不可变、原始数据的类文件对象，一个Blob对象就是一个包含有只读原始数据的类文件对象。Blob对象中的数据并不一定得是js中的原生形式。File接口基于Blob，继承了Blob的功能,并且扩展支持了用户计算机上的本地文件。它的存在，允许我们可以通过JS直接操作二进制数据。还可以通过Blob设置二进制数据的MIME类型。
2023-10-29 19:47:35
198
原创 vue3结合Cesium加载倾斜摄影3dtiles
这篇文章主要是为了记录加载3dtiles时模型与地形有时候存在一些高度上的差异，为此将解决方法做一个记录，便于其他读者使用。
2023-10-22 19:50:12
1234
原创 vue清除动态路由
查看vue-router路由文档 可以看出 Vue2中是通过matcher来进行重新赋值来进行清空的。而Vue3中没有关于matcher这个属性，这样一来，就需要自己通过循环遍历来清除路由，
2023-10-15 19:46:41
2977
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人