更新网址

content/posts/2022/08/JavaScript和Vue中实现表格(table)固定表头和首列【提供Vue和原生代码】.md

@@ -13,7 +13,7 @@ categories: [ 'skill' ]
 
 实际效果展示：
 
-![在这里插入图片描述](/duyl328/posts/2022/08/img-1.gif)
+![在这里插入图片描述](/posts/2022/08/img-1.gif)
 
 对于列的固定，`table`中有对应的方法，但是如果列和表头都要固定，只能通过其他方式实现，<span style="color:red;">如果您找到了更好的自身方法，还请斧正</span>
 

content/posts/2022/08/Vue3新属性 — css中使用v-bind（v-bind in css）.md

@@ -188,19 +188,19 @@ categories: [ 'skill' ]
 
   首先是第一种，如果使用的话会直接报错，报错内容为：
 
- ![在这里插入图片描述](/duyl328/posts/2022/08/img-1.png)
+ ![在这里插入图片描述](/posts/2022/08/img-1.png)
 
   因为`less`的直接报错，导致定义的变量压根就没有被编译出来，从而报错
 
   第二种和第三种错误一样：
 
-![在这里插入图片描述](/duyl328/posts/2022/08/img-2.png)
+![在这里插入图片描述](/posts/2022/08/img-2.png)
 
 
 
   在这种使用方式中，变量可以正确承接，但是不能完成拼接的操作，导致只有变量而没有单位，并且可以看出最终都被翻译为`var(--变量名)`来执行，所以顺便也对`var()`进行了拼接测试
 
-![在这里插入图片描述](/duyl328/posts/2022/08/img-3.png)
+![在这里插入图片描述](/posts/2022/08/img-3.png)
 
 
 
@@ -240,18 +240,18 @@ categories: [ 'skill' ]
 
   结果也非常让不出意外的都不行，并且在第二种方式也是直接报错的，在寻找问题的过程中，发现了更加`amazing`的事情：
 
-![在这里插入图片描述](/duyl328/posts/2022/08/img-4.png)
+![在这里插入图片描述](/posts/2022/08/img-4.png)
 
 
   这个变量压根就没定义，或者说没被识别到，所以重新模仿`Vue`直接定义行内样式，并且使用拼接尝试：
 
-![在这里插入图片描述](/duyl328/posts/2022/08/img-5.png)
+![在这里插入图片描述](/posts/2022/08/img-5.png)
 
 
 
   这种直接的拼接方式直接将所有内容都进行了拼接，再换一种思路：使用`V-bind`这个V-bind指的是数据的而不是样式：
 
-![在这里插入图片描述](/duyl328/posts/2022/08/img-6.png)
+![在这里插入图片描述](/posts/2022/08/img-6.png)
 
 
 
@@ -362,14 +362,14 @@ categories: [ 'skill' ]
 
   `v-bind() in css`并没有进行劫持或者其他操作，他主要完成的任务是将`v-bind()`中的内容通过自定义属性的方式进行了重新定义，在编译后代码中可以看到
 
-  ![在这里插入图片描述](/duyl328/posts/2022/08/img-7.png)
+  ![在这里插入图片描述](/posts/2022/08/img-7.png)
 
 
   所有的数据直接在自定义属性中进行，并且直接对应引用，自定义属性的内容的改变影响视图的效果，从而达到数据影响视图的效果，这个在使用中`less`,`css`中完全没有问题
 
   但是，在`scss`中，因为编译之后`名字无法进行匹配`从而造成样式的丢失
 
-  ![在这里插入图片描述](/duyl328/posts/2022/08/img-8.png)
+  ![在这里插入图片描述](/posts/2022/08/img-8.png)
 
 
   可以看到，使用的名字和编译的名字并不匹配，从而出错，这个使用时需要注意