- 博客(96)
- 问答 (2)
- 收藏
- 关注
RSS订阅原创 TypeScript 第十三节：声明文件
总的来说，声明文件是 TypeScript 与 JavaScript 生态系统进行互操作的重要桥梁之一，让 TypeScript 开发者可以享受到 JavaScript 生态系统的丰富资源，同时保持类型安全和智能提示。
2023-12-12 15:55:24
682
原创 TypeScript 第十二节：模块
TypeScript 支持多种模块化方案，包括 CommonJS、AMD、ES6 等，可以根据具体的应用场景选择合适的模块化方案。TypeScript 模块的语法和 JavaScript 模块的语法非常相似，可以使用。TypeScript 模块是一组相关的函数、类、变量、接口等实体的封装单元。它们可以被导入到其他代码文件中，以便在这些文件中使用其中的实体。命名空间是一个封装器，它将一组相关的函数、类、接口等封装在一个定义中。模块路径映射：您可以使用模块路径映射提供一个虚拟路径，使编译器可以查找和引用它。
2023-12-12 15:24:40
694
原创 TypeScript 第十一节：命名空间
命名空间中的所有内容导入当前文件中的一个对象。在 TypeScript 中，命名空间是一个独立作用域中的代码集合。在 TypeScript 中，可以使用嵌套的命名空间来组织代码。这样，就可以在当前 TypeScript 文件中使用。在使用命名空间中的类型和函数时，需要使用命名空间前缀。要在命名空间中使用另一个命名空间中的内容，可以使用。当一个命名空间在一个单独的 TypeScript 文件中时，可以使用。要在 TypeScript 文件中引用另一个命名空间，可以使用。来访问命名空间中的类型和函数。
2023-12-12 15:02:24
589
原创 TypeScript 第十节：对象
对象可以使用类或接口进行定义。鸭子类型（英语：duck typing）是动态类型的一种风格，是多态(polymorphism)的一种形式。在这种风格中，一个对象有效的语义，不是由继承自特定的类或实现特定的接口，而是由"当前方法和属性的集合"决定。这就是鸭子类型的体现，即两个不同的类型可以被视为相同的类型，只要它们具有相同的属性和方法。在 TypeScript 中，如果两个类型具有相同的属性和方法，那么它们就可以视为同一种类型。鸭子类型是指，如果一只鸟走起来像鸭子，叫起来像鸭子，那么它就可以被视为一只鸭子。
2023-12-12 10:10:50
559
原创 TypeScript 第九节：类
/ 成员变量// 构造函数// 成员函数这个类包含了一个构造函数和一个成员函数getInfo()，并且定义了两个成员变量name和age。// 输出 "Name: Alice, Age: 30"定义一个父类，其中包含需要被继承和重写的属性和方法。speak() {定义一个子类，并使用extends关键字继承父类。speak() {
2023-12-11 17:21:16
896
原创 TypeScript 第八节：接口
TypeScript 接口（interface）是一种类型定义，用于表示对象的属性和方法以及函数的参数和返回值类型。它类似于其他编程语言中的接口，用于约束对象或函数的结构和类型。通过实现接口，可以使代码更加规范和易于维护。
2023-12-11 16:49:41
447
原创 TypeScript 第七节：函数
其中，x和y的类型都是数字，返回值的类型也是数字。这个函数可以接受两个字符串或两个数字，并返回它们的组合。如果传递的参数不是字符串或数字，则返回的类型将是any。
2023-12-11 16:36:03
438
原创 TypeScript 第六节：循环语句
类似于 while 循环，但会先执行一次循环体，再判断条件是否为 true。用于迭代可迭代对象（如数组、字符串、Map 等）的每一个元素。在指定条件为 true 时，重复执行一段代码。用于重复执行一段代码指定次数的循环。用于枚举对象的所有可枚举属性。
2023-12-11 16:27:43
643
原创 TypeScript 第五节：条件语句
TypeScript 的条件语句与 JavaScript 的条件语句类似，包括 if 语句、if...else 语句、switch 语句等。if...else 语句用于判断指定条件是否为 true，如果是 true，则执行一个代码块，否则执行另一个代码块。if 语句用于判断指定条件是否为 true，如果是 true，则执行一段代码块。switch 语句用于根据不同的条件执行不同的代码块。
2023-12-11 16:19:31
592
原创 TypeScript 第四节：运算符
赋值运算符：赋值=、加等于+=、减等于-=、乘等于*=、除等于/=、余等于%=、左移等于=、无符号右移等于>>>=、按位与等于&=、按位或等于|=、按位异或等于^=比较运算符：等于==、不等于!=、严格相等===、严格不相等!==、大于>、小于=、小于等于
2023-12-11 16:14:55
701
原创 TypeScript 第三节：变量声明
需要注意的是，在使用类型断言时应该尽量避免类型转换错误，因为类型断言并不会改变变量的实际类型，而只是告诉 TypeScript 编译器以一种特定的方式解释该变量的类型。在TypeScript中，as语法更加常用，因为它既可以用于类型断言，也可以用于类型别名中的类型指定。使用as语法的类型断言，需要把待转换的变量放在变量名后面，并用as操作符指定类型。使用尖括号语法的类型断言，需要把待转换的变量放在尖括号内并指定类型。两种形式的作用是相同的，可以根据自己喜欢的风格来使用。
2023-12-11 15:57:03
482
原创 TypeScript 第二节：基础类型
除了以上基础类型，TS 还支持其他高级类型，如元组（tuple）、枚举（enum）、联合类型（union）、交叉类型（intersection）等。
2023-12-11 15:15:42
447
原创 TypeScript 第一节：安装
DOM 里面的 console 是浏览器环境下的，属于浏览器BOM API，Node 里面的 console 是 Node.js 里面的，由nodejs自己定义的API，两者虽然有同样的功能，但是并不是同一个东西，例如你可以参考：如果从 Node.js 编译到浏览器环境， Webpack 本来是需要对 console 进行 polyfill 的，但是恰好有一样的功能，所以不需要。你可以把 console 想成 fs 就是一样的道理了，你不装 @types/node 根本无法使用 fs 的类型提示。
2023-12-04 11:32:31
517
原创 ElementUI图片上传 缩略图 picture-card 数量限制
ElementUI图片上传 缩略图 picture-card 数量限制，问题描述：在图片上传列表中，需要对图片上传的个数进行限制，在增加图片到最大数量限制时，就将上传框隐藏掉；在删除后，就再次显示出来；如果仅仅用 limit 是 可以实现功能的，但是会在后面发现下图最后面的框，还能选取文件，只是上传不了；
2022-11-09 10:03:14
2278
原创 vue 使用 screenfull.js 页面全屏功能
用 screenfull 来实现一个全屏的功能，通过点击放大和缩小按钮去操控这个全屏效果，里面会需要的图标需要自己下载 iconfont。
2022-09-15 14:44:46
1684
3
原创 el-table 列内容溢出 显示省略号 悬浮显示文字
el-table 表格列内容溢出，文本溢出，显示省略号，单行、多行省略；鼠标悬浮hover（点击click等其他其他事件）显示文字，包括el-tooltip、el-popover、show-overflow-tooltip、title等其他的一些实现方法的总结，以及一些想法的分享！...
2022-08-03 11:19:47
10964
2
原创 Vue 引入高德地图 vue-amap
高德开发者平台—链接地址1、控制台——我的应用——创建应用——添加key 创建应用 新建应用 选择web端（JS平台） last：到这里的 key 就有了，还得到了一个安全密钥；1、安装 2、在 main.js 里引入其中更多的插件，请参考： 插件的使用-入门-教程-地图 JS API | 高德地图API (amap.com)3、HTML部分：编写容器4、Script 部分：引入 AMapManager5、Style部分（自己根据实际场景调试） 最后的效果图： 文章
2022-07-12 10:05:23
5018
1
原创 Gitlab 合并分支代码到主分支上
在 gitlab 中，将自己的分支和主分支进行合并，发送合并请求，由管理员同意请求后，完成合并操作，同意分支代码的一致性；本篇文章，通过图文带入的方式，一步步引导，完成合并步骤；
2022-07-06 10:26:45
8806
1
原创 【ElenmentUI el-date-picker日期选择器，结束时间不得早于开始时间，且只能选择距开始时间指定天数的日期】
场景：1、开始时间不得晚于结束时间；结束时间不得早于开始时间；2、开始时间与结束时间之间，有可选择的天数间隔，只可选择间隔日期内的日期；例如：设置间隔时间为5天；日期的取值范围，如下：2022-05-26 00:00:00——2022-05-30 23:59:592022-05-26 10:00:00——2022-05-31 10:00:00效果：完整代码：<template> <div> <el-but...
2022-05-26 16:56:58
3346
1
原创 CSS练习小题（十）：鼠标移入移出图片-翻转效果-过渡动画
效果图：代码：（vue）<template> <div> <el-button @click="getData">请求数据</el-button> <div class="box_wrap"> <div class="box" @mouseenter="todo=!todo;" .
2022-04-28 10:58:46
644
原创 vue2.0 引入Swiper
安装配置名称 版本号 swiper 5.x vue-awesome-swiper 3.1.3 安装命令：npm install swiper@5.x vue-awesome-swiper@3.1.3 --save-dev在main.js里引入：加入以下代码：import VueAwesomeSwiper from 'vue-awesome-swiper'import 'swiper/css/swiper.css';Vue.use(VueA
2022-04-27 17:39:45
1533
原创 解决vue报错-Syntax Error: TypeError: this.getOptions is not a function
场景：项目中写了一段less代码，但是没有下载安装 less 和 less-loader；安装命令：（同时安装 less 和 less-loader，默认最新版本）npm install less less-loader --save-dev安装时版本如下：（在package.json里查看）"less": "^4.1.2","less-loader": "^10.2.0",错误示例：*解决方案：一般都是因为less-loader的版本太高，需要降低less-loa.
2022-04-24 14:37:14
1809
原创 vue2.0 全局挂载自定义指令和组件
一、在src>components下新建index.js二、在这个 index.js 里引入组件及自定义指令// 引入自定义分页组件import paging from "@/components/common/paging.vue";export default { // 全局挂载 install(Vue) { // 挂载为全局组件 Vue.component("paging", paging); // 自定义拖拽指令 Vue.d.
2022-04-20 17:37:54
2297
原创 Vue2.0 自定义指令
一、除了核心功能默认内置的指令 (v-model 和 v-show)，Vue 也允许注册自定义指令。directive二、全局指令与局部指令1、全局自定义指令// 注册一个全局自定义指令`v-focus` Vue.directive('focus', {// 当被绑定的元素插入到 DOM 中时……inserted: function (el) {// 聚焦元素el.focus...
2022-04-20 16:56:36
567
原创 在main.js中Vue.config.productionTip的作用
背景：当 没有设置这行代码 或 设置为TRUE 的时候控制台输出：Vue.config.productionTip 阻止启动生产消息，常用作指令开发环境下，Vue 会提供很多警告来帮你对付常见的错误与陷阱。而在生产环境下，这些警告语句却没有用，反而会增加应用的体积。此外，有些警告检查还有一些小的运行时开销，这在生产环境模式下是可以避免的。在main.js中设置Vue.config.productionTip = false;import Vue from 'vue'i
2022-04-20 10:47:44
532
原创 CSS练习小题（九）：静态登录页
效果：代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> &l.
2022-04-19 14:23:20
148
原创 CSS练习小题（八）：文字描边特效
效果图：关键代码： -webkit-text-stroke: 3px purple;text-stroke 属性 描述 text-stroke-width 设置或检索对象中的文字的描边厚度 text-stroke-color 设置或检索对象中的文字的描边颜色 全部代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"...
2022-04-15 17:36:32
276
原创 CSS通栏背景的设置（解决浏览器缩放带来的影响）
效果图：（边框区域为正文版心）代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0.
2022-04-15 11:28:58
669
原创 替换URL中的特殊字符（%E2%80%8B）
一、场景：在复制后端接口文档的时候,调用时直接报404错误，查看请求的时候，发现有特殊字符出现，经排查url，发现其中有特殊字符，且肉眼无法识别。具体表现：鼠标光标在慢慢向后移动时，会在特殊字符那里停顿一下；错误示例：/api/menu/goodsList/二、解决办法：1、delete找到特殊字符的位置，直接删除；2、将 特殊字符 替换 为 ‘’// 请求拦截器axios.interceptors.request.use( config => {
2022-04-11 10:03:07
5999
原创 【HTML前端全屏效果——按钮切换】
效果图：单击按钮切换全屏效果全部代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-sc..
2022-04-06 11:11:56
1398
原创 Vue 制作滚动字幕，用于展示通知内容
1、场景：用于展示一些通知内容；2、效果图：3、步骤：第一步：引入 jQuery 和 jquery.marquee.js ;<script> import $ from "@/views/test/components/jquery-3.2.1.min.js"; import "@/views/test/components/jquery.marquee.min.js";</script>第二步：准备一个内容展示容器，并绑定数据..
2022-03-28 14:06:32
1800
原创 CSS练习小题（七）：三栏自适应
效果图：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> ..
2022-03-23 15:19:09
170
原创 CSS文本强制换行
发生背景：在没有空格的（字母、数字，符号），超过容器宽度时就会把容器撑大，不换行。所以在这里需要对其设置强制换行的样式；解决方案：/* word-wrap: break-word; */ /* word-break: break-all; */区别：word-wrap: break-word;如果一个单词在一行放不下，就会将它放到下一行；word-break: break-all;如果一个单词在一行放不下，就会将它截开；全部...
2022-03-21 16:10:05
3205
空空如也
vue项目关于循环调接口的相关问题
2022-01-17
将promise赋值给变量，再用变量.then方法处理成功的操作，可以吗？
2022-01-04
TA创建的收藏夹 TA关注的收藏夹
TA关注的人