更新时间

2025-01-20 10:15:03 +08:00
1 parent bc3addcd63
commit 79f7eec41d
@@ -1,10 +1,13 @@
---
+---
 layout: doc
 title: JavaScript和Vue中实现表格(table)固定表头和首列
 date: 2022-08-26
 tags:
  - 编程
  - 学习
+  - Html
+  - JavaScript
+  - vue
 head:
  - - meta
    - name: description
@@ -13,8 +16,7 @@ head:
    - name: keywords
      content: vue vue3 js javascript
 editLink: false
-lastUpdated: true
-
+lastUpdated: 2025-01-20T10:09:00
 ---

 > 文章摘要
@@ -30,7 +32,7 @@ JavaScript、Vue、React、小程序等）。文章详细展示了实现这一

 实际效果展示：

-![在这里插入图片描述](/posts/2022/08/img-1.gif)
+![在这里插入图片描述](../../../public/posts/2022/08/img-1.gif)

 ## 思路概述

@@ -1,10 +1,11 @@
---
+---
 layout: doc
 title: Vue3中的ref为何要用.value进行值的调用？
 date: 2022-08-25
 tags:
  - 编程
  - 学习
+  - vue
 head:
  - - meta
    - name: description
@@ -13,8 +14,7 @@ head:
    - name: keywords
      content: vue vue3 js javascript
 editLink: false
-lastUpdated: true
-
+lastUpdated: 2025-01-20T10:09:00
 ---

 > 文章摘要
@@ -1,10 +1,11 @@
---
+---
 layout: doc
 title: Vue3新属性 — css中使用v-bind（v-bind in css）
 date: 2022-08-11
 tags:
  - 编程
  - 学习
+  - vue
 head:
  - - meta
    - name: description
@@ -13,8 +14,7 @@ head:
    - name: keywords
      content: vue vue3 js javascript v-bind
 editLink: false
-lastUpdated: true
-
+lastUpdated: 2025-01-20T10:09:00
 ---

 > 文章摘要
@@ -216,19 +216,19 @@ LESS：与 CSS 类似，使用变量和 v-bind() 绑定数据，但在 LESS 中

  首先是第一种，如果使用的话会直接报错，报错内容为：

- ![在这里插入图片描述](/posts/2022/08/img-1.png)
+ ![在这里插入图片描述](../../../public/posts/2022/08/img-1.png)

  因为`less`的直接报错，导致定义的变量压根就没有被编译出来，从而报错

  第二种和第三种错误一样：

-![在这里插入图片描述](/posts/2022/08/img-2.png)
+![在这里插入图片描述](../../../public/posts/2022/08/img-2.png)



  在这种使用方式中，变量可以正确承接，但是不能完成拼接的操作，导致只有变量而没有单位，并且可以看出最终都被翻译为`var(--变量名)`来执行，所以顺便也对`var()`进行了拼接测试

-![在这里插入图片描述](/posts/2022/08/img-3.png)
+![在这里插入图片描述](../../../public/posts/2022/08/img-3.png)



@@ -268,18 +268,18 @@ LESS：与 CSS 类似，使用变量和 v-bind() 绑定数据，但在 LESS 中

  结果也非常让不出意外的都不行，并且在第二种方式也是直接报错的，在寻找问题的过程中，发现了更加`amazing`的事情：

-![在这里插入图片描述](/posts/2022/08/img-4.png)
+![在这里插入图片描述](../../../public/posts/2022/08/img-4.png)


  这个变量压根就没定义，或者说没被识别到，所以重新模仿`Vue`直接定义行内样式，并且使用拼接尝试：

-![在这里插入图片描述](/posts/2022/08/img-5.png)
+![在这里插入图片描述](../../../public/posts/2022/08/img-5.png)



  这种直接的拼接方式直接将所有内容都进行了拼接，再换一种思路：使用`V-bind`这个V-bind指的是数据的而不是样式：

-![在这里插入图片描述](/posts/2022/08/img-6.png)
+![在这里插入图片描述](../../../public/posts/2022/08/img-6.png)



@@ -390,14 +390,14 @@ LESS：与 CSS 类似，使用变量和 v-bind() 绑定数据，但在 LESS 中

  `v-bind() in css`并没有进行劫持或者其他操作，他主要完成的任务是将`v-bind()`中的内容通过自定义属性的方式进行了重新定义，在编译后代码中可以看到

-  ![在这里插入图片描述](/posts/2022/08/img-7.png)
+  ![在这里插入图片描述](../../../public/posts/2022/08/img-7.png)


  所有的数据直接在自定义属性中进行，并且直接对应引用，自定义属性的内容的改变影响视图的效果，从而达到数据影响视图的效果，这个在使用中`less`,`css`中完全没有问题

  但是，在`scss`中，因为编译之后`名字无法进行匹配`从而造成样式的丢失

-  ![在这里插入图片描述](/posts/2022/08/img-8.png)
+  ![在这里插入图片描述](../../../public/posts/2022/08/img-8.png)


  可以看到，使用的名字和编译的名字并不匹配，从而出错，这个使用时需要注意
@@ -1,17 +1,17 @@
---
+---
 layout: doc
 title: 在JavaScript获取Promise的状态
 date: 2022-08-09
 tags:
  - 编程
  - 学习
+  - JavaScript
 head:
  - - meta
    - name: keywords
      content: js javascript
 editLink: false
-lastUpdated: true
-
+lastUpdated: 2025-01-20T10:08:00
 ---