Himmelbleu

2023年7月25日

摘要： # 完整代码以下是完整代码，从本实践中了解 Konva 的多事件处理，以及灵活运用 Konva 的 API，以实践达到灵活地对 Konva 的使用。 title:(在线浏览 Konva 实现的简单线条画布 Demo) link:(https://himmelbleu.gitee.io/web-le 阅读全文

posted @ 2023-07-25 02:08 Himmelbleu 阅读(92) 评论(0) 推荐(0) 编辑

Konva - 多事件（Multi-Event）与多端事件处理

摘要：除了 Konva 中图形（Shape）的单个事件以外，还可以在同一个 `on` 中定义多个事件，并同时触发同一个回调函数。 ```js file:[multi-event] const stage = new Konva.Stage({ container: "container", width: 阅读全文

posted @ 2023-07-25 01:11 Himmelbleu 阅读(6) 评论(0) 推荐(0) 编辑

Konva - 自定义 Shape（图形）

摘要：除了官方内置的[图形](https://konvajs.org/docs/shapes/Rect.html)以外，我们可以通过 `Konva.Shape` 类自定义图形，如下所示： ```js const stage = new Konva.Stage({ container: "container 阅读全文

posted @ 2023-07-25 01:04 Himmelbleu 阅读(17) 评论(0) 推荐(0) 编辑

2023年7月10日

如何让没有高度的父元素下的子元素的百分比 height 属性有效？

摘要：一个父 div 没有高度，子元素设置的百分比高度就是无效的，因为 `height` 属性是基于父级以上的元素高度进行确认的。所以，下面代码中，h2 的 `::before` 设置百分比高度就行不通。 ```scss h2 { &::before { content: ""; width: 0.5re 阅读全文

posted @ 2023-07-10 21:25 Himmelbleu 阅读(9) 评论(0) 推荐(0) 编辑

2023年7月9日

TypeScript 条件类型（Conditional Types）以及 infer 关键字

摘要： # 什么是条件类型条件类型可以让程序根据输入的类型来决定输出的类型是什么，也就是说根据不同的输入类型来确定输出的类型。条件类型的形式有点类似于 JS 中的条件表达式（condition ? trueExpression : falseExpression）： ```ts file:[条件类型的规则阅读全文

posted @ 2023-07-09 19:46 Himmelbleu 阅读(3) 评论(0) 推荐(0) 编辑

2023年7月6日

TypeScript 映射类型（Mapped Types）以及 in 关键字

摘要： # 简单的例子以下是一个简单的例子，通过[索引访问类型（Indexed Access Types）](https://www.typescriptlang.org/docs/handbook/2/indexed-access-types.html)，可以给一个对象定义 key 的类型以及 valu 阅读全文

posted @ 2023-07-06 02:19 Himmelbleu 阅读(2) 评论(0) 推荐(0) 编辑

2023年7月1日

实现 Scss 打开列表逐一淡出的效果

摘要： # 界面结构 ```html file:[App.vue - template] 回到顶部我的标签随笔分类文章分类随笔归档文章归档我的相册我的日历 ``` 刚开始列表处于隐藏状态，也就是超出了屏幕显示的区域，改变 isActiveMenu 的状态让列表出现或关闭，与此同时对应运用 cl 阅读全文

posted @ 2023-07-01 15:02 Himmelbleu 阅读(4) 评论(0) 推荐(0) 编辑

Mybatis/Mybatis Plus - PageHelper 的基础示例

摘要：导入依赖 file:[pom.xml] <dependency> <groupId>com.github.pagehelper</groupId> <artifactId>pagehelper-spring-boot-starter</artifactId> <version>1.4.6</vers 阅读全文

posted @ 2023-07-01 01:12 Himmelbleu 阅读(8) 评论(0) 推荐(0) 编辑

2023年6月24日

Vue-Router - el-breadcrumb 自动渲染路径

摘要：通过 `router` 获取当前的路由列表，在路由变化时，调用 `getCurrentRouteList` 重新获取当前的路由列表。 ```js file:[src/App.vue - script] const route = useRoute(); const router = useRoute 阅读全文

posted @ 2023-06-24 01:49 Himmelbleu 阅读(13) 评论(0) 推荐(0) 编辑

Vue - 判断鼠标滚轮的上下方向

摘要： file:[src/hooks/use-mouse.js] import { useThrottleFn } from "@vueuse/core"; export function useWheelRollsUpAndDown( onDown: Function, onUp?: Function, 阅读全文

posted @ 2023-06-24 01:44 Himmelbleu 阅读(6) 评论(0) 推荐(0) 编辑

loading