- 博客(499)
- 资源 (16)
- 问答 (1)
- 收藏
- 关注
RSS订阅
原创 2023年--常用JS工具函数整理(utils.js)
使用场景：从数组中删除所有重复的值，实现方式很多，我们采取最简单的方式。一行代码搞定。uniqueArr 方法将传入的数组转换为Set，然后再解构为数组返回。
2023-01-05 12:02:00
602
原创 web前端开发VScode必备插件(磨刀不误砍柴工)
Bracket Pair Colorizer友好的给括号加上不同的颜色，便于区分不同的区块，使用者还可以定义括号类型和颜色，尤其是 Dart 语言开发，尤为重要。Terminal编辑器中内嵌一个似 cmd 终端程序，直接在编辑器中运行终端命令。Path Intellisense插件自动提示文件路径，支持各种文件无脑快速引入，非常方便。JavaScript(ES6) code snipp...
2020-01-03 09:06:32
1779
原创 vue3 -- 项目使用自定义字体font-family
引入字体文件： 首先，确保你的字体文件（通常是.woff、.woff2、.ttf等格式）位于项目中的某个目录下，比如src/assets/fonts/。在全局样式中定义字体： 在你的全局样式文件中（通常是App.vue或者一个单独的样式文件），使用@font-face规则引入字体文件，并定义字体名称。在Vue 3项目中使用自定义字体（font-family）的方法与在普通的HTML/CSS项目中类似。
2024-04-18 15:18:40
208
原创 在uniapp开发的H5页面中，当我们使用浏览器的刷新功能时，会导致页面栈被清空，从而出现无法返回的跳转问题。
导航栏组件项目引入了uview-ui,直接进入u-navbar源码位置去修改。
2024-01-27 11:33:50
108
原创 vue2 -- 截图工具html2canvas
其中，this.$refs.capture 是一个引用，它可以指向组件内的某个 HTML 元素，以便让 html2canvas 截取该元素。:这样就可以在 Vue 中使用 html2canvas 实现截图功能了。在回调函数中，可以根据需要对生成的 Canvas 元素进行进一步处理，比如显示在页面上、下载为图像文件或上传到服务器等操作。1：安装 html2canvas 库。可以将网页中的指定元素或整个页面截取为图片，以便保存或分享。:3：编写截图逻辑。在 Vue 中使用 html2canvas 实现。
2024-01-18 14:14:36
349
原创 TypeScript入门实战笔记 -- 07 接口类型与类型别名：这两者的用法与区别分别是什么？
在以上示例中，你可能会觉得接口类型仅能用来定义对象的类型，但是接口类型还可以用来定义函数的类型（备注：仅仅是定义函数的类型，而不包含函数的实现），具体示例如下。/** 单独的函数实践 */在示例第 1~3 行，我们定义了一个接口类型 StudyLanguage，它有一个函数类型的匿名成员，函数参数类型 ProgramLanguage，返回值的类型是 void，通过这样的格式定义的接口类型又被称之为可执行类型，也就是一个函数类型。
2023-12-26 14:54:14
86
原创 TypeScript入门实战笔记 -- 06 类类型：如何高效使用类型化的面向对象编程利器？
在上面的例子中我们可以看到，第 3 行 Son 类的 lastName 属性是私有的，只在 Son 类中可见；类的最后一个特性——类的类型和函数类似，即在声明类的时候，其实也同时声明了一个特殊的类型（确切地讲是一个接口类型），这个类型的名字就是类名，表示类实例的类型；在第 1～5 行，我们定义了一个包含 x、y、add 属性和方法的接口类型（详见 07 讲），然后在第 6～12 行实现了拥有接口约定的x、y 属性和 add 方法，以及接口未约定的 addTwice 方法的NumAdder类。
2023-12-18 10:48:50
69
原创 TypeScript入门实战笔记 -- 05 函数类型：返回值类型和参数类型到底如何定义？
在上述代码中，函数 log3 的函数参数 x 的类型为可选的联合类型 number | string，但是因为默认参数字符串类型是联合类型 number | string 的子类型，所以 TypeScript 也会检查通过。因此，如果我们将默认值设置为字符串类型，编译器就会抛出一个 ts(2322) 的错误。在上述代码中，在添加返回值类型的地方，我们通过“参数名 + is + 类型”的格式明确表明了参数的类型，进而引起类型缩小，所以类型谓词函数的一个重要的应用场景是实现自定义类型守卫（详见第 11 讲）。
2023-12-15 14:39:43
222
原创 TypeScript入门实战笔记 -- 04 什么是字面量类型、类型推断、类型拓宽和类型缩小？
1：使用vscode 新建一个 04.Literal.ts 文件，运行下列示例。2：执行 tsc 04.Literal.ts --strict --alwaysStrict false --watch 执行：nodemon 04.Literal.js 前面我们已经学习了 TypeScript 的基本语法和基础类型，接下来通过几个例子温习一下（为了避免命名冲突，后续示例中会引入一对花括符 {} 创建块级作用域）：看着上面的示例，定义基础类型的变量都需要写明类型注解，TypeScript 太麻烦了吧？在示
2023-12-14 11:41:03
97
原创 TypeScript入门实战笔记 -- 03 复杂基础类型：TypeScript 与 JavaScript 有何不同？
在恒为 false 的类型守卫条件判断下，变量的类型将缩小为 never（never 是所有其他类型的子类型，所以是类型缩小为 never，而不是变成 never）。注意：类型断言的操作对象必须满足某些约束关系，否则我们将得到一个 ts(2352) 错误，即从类型“源类型”到类型“目标类型”的转换是错误的，因为这两种类型不能充分重叠。我们可以对被注解为 any 类型的变量进行任何操作，包括获取事实上并不存在的属性、方法，并且 TypeScript 还无法检测其属性是否存在、类型是否正确。
2023-12-13 14:33:29
80
原创 TypeScript入门实战笔记 -- 02 简单基础类型：TypeScript 与 JavaScript 有何不同？
TypeScript 其实就是类型化的 JavaScript，它不仅支持 JavaScript 的所有特性，还在 JavaScript 的基础上添加了静态类型注解扩展。这里我们举个例子来说明一下，比如 JavaScript 中虽然提供了原始数据类型 string、number，但是它无法检测我们是不是按照约定的类型对变量赋值，而 TypeScript 会对赋值及其他所有操作默认做静态类型检测。
2023-12-12 13:44:11
68
原创 TypeScript入门实战笔记 -- 01 如何快速搭建 TypeScript 学习开发环境？
特别需要注意的是，VS Code 默认使用自身内置的 TypeScript 语言服务版本，而在应用构建过程中，构建工具使用的却是应用路径下 node_modules/typescript 里的 TypeScript 版本。基于它，我们无须在本地安装环境，只需要一个浏览器即可随时学习和编写 TypeScript，同时还可以方便地选择 TypeScript 版本、配置 tsconfig，并对 TypeScript 实时静态类型检测、转译输出 JavaScript 和在线执行。
2023-12-11 10:23:41
273
原创 TypeScript入门实战笔记 -- 开篇 为什么要选择 TypeScript ？
TypeScript 是一种静态类型检查的编程语言，它由 Microsoft 开发和维护。相比竞争对手 Facebook 的 Flow，TypeScript 更具备类型编程的优势，而且还有 Microsoft、Google 这两家国际大厂做背书。越来越多的主流框架（例如 React、Vue 3、Angular、Deno、Nest.js 等）要么选用 TypeScript 编写源码，要么为 TypeScript 提供了完美的支持。随着 TypeScript 的普及，TypeScript 在国内（国内滞后国外）
2023-12-09 16:57:20
117
原创 vue2 -- 解决el-table自适应高度,页面不显示多条滚动条，超出的部分让el-table内部出现滚动条。
在开发中，需要表格控件根据浏览器高度进行调整，固定表头，且然后多余的出滚动条，官方给出的：只要在el-table元素中定义了height属性，即可实现固定表头的表格，而不需要额外的代码。页面上布局是头部-面包屑，中间-表格，底部-分页组件。需要使表格高度需要自适应屏幕。\src\mixins\TableHeight.js 新建 TableHeight.js 文件。首先先import导入js文件，mixins中使用。
2023-12-06 11:04:45
679
原创 vue2 - SuperMap3D加载基于Nginx服务生成的3DTileset模型切片服务地址
在Vue2中，我们可以利用SuperMap3D加载基于Nginx服务生成的3DTileset模型切片服务地址。这种技术能够实现高性能的三维地理数据展示和交互，通过Nginx服务快速响应客户端请求并转发到后端服务。结合Vue2和SuperMap3D的API，可以轻松集成并渲染地理数据，实现流畅的用户体验和快速的数据加载速度。这样的技术组合为用户呈现出令人印象深刻的地理信息可视化效果，为三维地图应用提供了强大的支持。
2023-11-17 10:21:36
626
原创 vue2 - SuperMap3D添加S3M图层
SuperMap iClient3D for WebGL/WebGPU 提供多种接口，支持在创建好的三维场景中添加种类丰富的数据图层。在此以添加地形图层为例介绍使用WebGPU方式加载的方法。(1).通过open接口将整个场景打开，这种方法简单易操作且不易出现遗漏图层的情况。
2023-11-16 13:42:50
526
原创 Nginx 服务配置相关
为了解决这个问题，可以借助Nginx的配置来处理跨域请求。在Nginx的配置中，可以使用代理_pass指令将请求转发到目标服务器，并在响应中添加必要的跨域头信息，以便让浏览器允许跨域请求。跨域是指在浏览器的同源策略下，当一个页面的脚本试图向不同源的服务器（域名、协议、端口号任何一个不同）发起请求时，就会产生跨域问题。协议不同：例如，一个页面使用 http 协议加载的资源尝试向使用 https 协议的资源发起请求。端口号不同：例如，一个页面使用 80 端口加载的资源尝试向使用 8080 端口的资源发起请求。
2023-11-16 09:45:09
96
原创 vue2 -- 对SuperMap进行class封装实现自定义标记点位和自定义弹窗功能
我们需要添加一个鼠标左键点击事件。当用户触发鼠标点击时，我们将利用 Vue 2.0 中的 Vue.extend() 方法动态创建一个 DOM 元素，并将它渲染到 Cesium 容器中。随后，我们将利用 Cesium 中提供的 viewer.scene.postRender 方法来实时更新坐标位置。这个实现思路很简单，接下来我们将进行具体的代码实现。
2023-11-14 14:33:25
528
2原创 vue2 集成 - 超图 - SuperMap iClient3D for WebGL 及常用方法
vue2 集成 SuperMap3D 方案，对 SuperMap3D 常用方法进行汇总。
2023-11-06 15:40:18
657
原创 vue2 -- 开发平台框架项目结构
node_modules：项目依赖public：公共资源包括html，ico图标及不需要打包的图片、插件等src：项目主代码资源node_modules：项目依赖api：全局接口assets：资源components：公共组件config: 配置文件（非环境变量）decorators: 装饰器directives: 自定义指令filters: 自定义过滤器lang：全局国际化layout：基础布局mixins： 全局混入modules：模块文件夹。
2023-10-31 16:35:21
115
原创 vue2 在 template 中使用 sass 变量
1：使用 CSS Modules 提供的 :export 关键字，示例如下。vue2 在 template 中使用 sass 变量。2：在 .vue 文件中使用。
2023-09-05 10:24:58
478
原创 uniapp集成windicss的流程
Windicss是一个基于Tailwind CSS 灵感的库，它更快、更兼容，使用 TypeScript构建。Windicss的目标是为了解决与Tailwind CSS 类似的问题，提供一个可以快速上手开发的组件库，让开发者不再需要繁琐地编写CSS 样式。Windicss包含了几乎所有的 CSS 样式，因此开发者只需要使用短短的几个字符就能实现原本需要编写多行 CSS才能实现的效果。
2023-09-04 11:02:40
1402
原创 uniapp -- 在组件中拿到pages.json下pages设置navigationBarTitleText这个值？
这样，你就能够在组件中获取到当前页面的 navigationBarTitleText 的值了。
2023-08-26 17:31:57
1534
原创 Typora上使用Mermaid语法展示流程图、时序图、甘特图
你已经安装Typora并打开了一个新文档后，可以按照以下详细步骤在Typora上使用Mermaid语法展示流程图、时序图、甘特图。
2023-08-26 09:57:58
1335
原创 Vue3 + Vite 中使用 vite-plugin-svg-icons 插件显示本地 SVG 图标
这样配置后，你就可以在 Vue 3 项目中显示本地的 SVG 图标了。请根据具体情况将代码中的路径和图标 id 替换为实际使用的内容。
2023-08-21 15:03:38
576
原创 实现 CSS 文字渐变色效果
接下来，使用 -webkit-background-clip 属性兼容 WebKit 内核浏览器，以确保在 Chrome 和 Safari 等浏览器中渐变效果正常显示。需要注意的是，为了支持跨浏览器兼容性，你可能需要添加其他浏览器私有前缀或使用标准的 CSS 渐变语法。在上面的示例中，我们使用 background-image 属性创建了一个从左到右的线性渐变，颜色依次为红色、绿色和蓝色。最后，通过将 color 设置为 transparent，使文字内容的颜色变为透明，从而显示出渐变色作为文字的颜色。
2023-08-21 09:09:45
388
原创 Vue3 -- 封装自定义的hooks
使用onMounted钩子，我们可以在组件挂载之后注册窗口调整大小的事件监听器，并在窗口尺寸变化时更新状态。在上述代码中，我们绑定了输入字段与对应的数据变量(name、email、password)，并使用计算属性(isNameValid、isEmailValid、isPasswordValid)来显示验证错误消息。上述代码中，我们使用ref函数创建了data、loading和error三个响应式状态变量，并在onMounted钩子中执行实际的数据获取逻辑。
2023-08-11 11:21:59
433
原创 变量方法常用命名
在这个目录下，你可能会找到类似于zh-CN.json或者zh-CN.js这样的文件，用于存储中文（简体）的翻译文本。这些文件中一般会以键值对的形式存储翻译文本，其中键表示需要翻译的原始文本，值则表示对应的翻译结果。在多语言应用程序中，通常会将不同语言的翻译文本存储在不同的文件中，这样可以方便地管理和维护多个语言版本。locales目录一般用于存放所有的语言文件，lang目录则用于存放特定语言的文件。具体而言，zh-CN是表示中文（简体）语言的标识符，表示该目录下的文件包含了中文（简体）的翻译文本。
2023-08-04 10:14:14
605
原创 js -- 实现根据url地址下载文件
在上面的代码中，我们定义了一个函数 downloadFile(url, filename)，它接受文件的 URL 和要保存的文件名作为参数。通过 fetch(url) 发起 GET 请求获取文件的响应数据。使用 Promise 的 then 方法，我们将响应数据转换为 blob 对象。可以使用 fetch 和 URL.createObjectURL 方法来实现根据 URL 下载文件。以下是一个示例代码：前置环节，不能存在跨域，若存在跨域，可使用 nginx 进行处理。
2023-07-31 15:18:28
2841
原创 BMapGL -- 使用Class在 Vue3 ts 中封装创建标记和多边形标签
在 MarkerLabel 类中，它使用了 BMapGL 对象来创建标记和标记标签，其中 BMapGL.Marker 和 BMapGL.Label 分别用于创建标记和标记标签。PolygonLabel 类接收一个 polConfig 对象作为参数，该对象包含创建多边形标签所需的各种配置信息，例如多边形的顶点坐标、多边形的样式、多边形的名称等。MarkerLabel 类接收一个 markConfig 对象作为参数，该对象包含创建标记所需的各种配置信息，例如标记的位置、标记的样式、标记的名称、标记的标识符等。
2023-07-29 12:01:23
542
原创 BMapGL -- 生成多个maker，获取指定标识的maker，并清除他们
在使用 Baidu Map JavaScript API 创建多个标记时，可以为每个标记设置一个唯一的标识符（identifier），以便在以后可以根据标识符获取特定的标记，并清除它们。使用一个对象（Object）或者 Map 来存储您创建的标记，然后根据标识符直接从对象或者 Map 中获取相应的标记，并清除它们。
2023-07-27 17:45:42
465
SuperMap iClient3D for WebGL 吊机模型文件
2023-11-08
前端关于 CSS，你该做好这 20 件事
2022-04-21
AMandroidstudio.zip
2020-11-23
Svn使用操作步骤.zip
2020-03-29
HTML页面JS引入的位置不同，会延迟浏览器对DOM的渲染吗？
2021-06-19
TA创建的收藏夹 TA关注的收藏夹
TA关注的人