- 博客(13)
- 收藏
- 关注
RSS订阅原创 css实现圈+箭头，箭头贴着圆的切线
一开始我的思路是这样，让箭头贴着圆外线，将旋转中心设置到圆心上，但无论如何，transform-origin似乎只能设置在红色方块内，于是换了思路。我直接将红色的方块网上定位，旋转点就可以设置在圆心上，在红色方块外部在包一层div将红色部分往下移。问题来了，实现一个静态的组件比较容易，但为了让组件更灵活，我希望能给组件传一个角度，箭头就会根据相应的角度显示。公司需要实现类似的一个页面，我就想着把每一个球都封装成一个组件。
2024-03-06 14:17:25
248
1
原创 解决使用el-dialog之后底层的布局会被向左挤压
在做vue3+element-plus的时候，很多地方用到了弹窗，但是每次使用弹窗的时候都会发现一个问题，弹窗下面的布局会因为弹窗的出现而被挤压。解决方案，在css初始化的样式中将body的宽度定好，问题解决。仔细观察了一下组件本身的样式，没发现问题。最后将注意点放在了body上面，==
2024-01-03 10:40:54
587
1
原创 解决el-dialog因为父元素使用了transform而没有显示全
这是一个大屏组件，点击相应的节点能够有一个弹窗，但是弹窗没有显示全，查了一下资料是因为父元素只要使用了transform,el-dialog使用的是fix定位，这样fix定位会被降级未absolute，给父元素加position: realtive,这样fix就能以屏幕定位了，但我用el-dialog还是没有解决。解决方案2：给el-dialog加一个属性append-to-body，问题解决。
2023-12-20 16:19:03
537
原创 解决vscode设置了保存自动格式化不生效
在做好各种格式化配置后，发现保存还是不会自动格式化，后来发现需要选择一个默认的插件才行。这里有很多，我需要用的是prettier所以选择了它，最后自动格式化就成功了。
2023-08-15 15:56:40
2161
原创 vant滚动导航不生效（已解决）
2.例如，你可以给外层的《div》元素添加一个class，然后在中使用scrollspy属性指定该class作为滚动容器的选择器，如：scrollspy=“.scroll-container”。1.你可以尝试自定义一个滚动容器，并在的scrollspy属性中指定自定义滚动容器的选择器。想要顶上的标签跟随这内容的滑动而改变，我一开始直接引用的官方文档没起作用，问了很久的gpt。
2023-08-03 14:20:06
992
原创 v-infinite-scroll element-plus无限加载
今天在用element-plus做商品无限加载的时候，看了一下文档，觉得挺简单的，商品是我自己封装的一个组件，直接给整个组件添加了v-infinite-scroll指令，然后打开浏览器看了下，每次我一滚动鼠标 就会触发，直接干到报错，把服务器弄干卡了，后来一直没找到问题，网上各种搜，还是没有找到问题，最后发现我将指令绑定再商品盒子上！怪不得只要一滚动鼠标就触发，
2023-05-31 18:51:25
376
1
原创 加入某个元素后突然多了很多空白
今天在自己做vue2项目的时候，加入了一组数据的渲染，页面突然多了很多空白，我大概能够知道是哪里但是就是排查不出来。查了很久，看到一个作者的代码，粘贴在控制台，最后终于排查出来了。就是这段神奇的代码，快去试试吧。
2023-05-20 20:59:46
51
1
原创 当我们在浏览器输入网址，按下回车的那一刻会发生什么
比如，如果是 HTML 类型，浏览器就会解析 HTML 代码，构建 DOM 树，解析 CSS 代码，构建渲染树，并进行布局和绘制，最终展示出页面。2.发起 TCP 连接：浏览器通过获取到的 IP 地址和目标服务器的端口号，建立一个 TCP 连接。3.发送 HTTP 请求：TCP 连接建立成功后，浏览器会构建一个 HTTP 请求报文，包括请求方法、请求头、请求体等信息，并发送给服务器。4.服务器处理请求并响应：服务器在接收到请求报文后，会根据请求报文中的信息进行处理，生成相应的响应报文，并返回给客户端。
2023-04-10 20:43:21
654
原创 BFC真的很简单
BFC( Block formatting context )翻译过来为"块级格式化上下文"。非常明显，按道理来说应该两个盒子间隔两个身位的，但是效果却不是，我们就可以利用BFC来解决整个问题box1和box2在两个不同的BFC内，所以他们的margin 不会出现之前的那个问题。相信到这里大家可能对BFC有一点点的了解了，那接下来开始讲概念。
2023-04-09 23:23:18
61
1
原创 Promise初步认识
④在then的回调函数中，return后面的东西会用Promise包装一下等价于下图，所以再then一次默认是成功态Promise。完成Promise实例对象，如果第一个完成的成功了，那最终就成功，如果第一个完成的失败了，那最终的就失败。关注多个Promise对象的状态变化，传入多个Promise实例，包装成一个新的Promise实例返回。（6）Promise.Settled()的状态与传入的Promise的状态无关永远它都只会忠实的。当pending->rejected时，执行then的第二个回调函数。
2023-04-03 08:34:08
53
1
空空如也
router-view
2023-06-14
node报错，问题简单，无奈
2023-06-04
vue3 + TS获取$store报错
2023-05-02
npm报错 ELIFECYCLE
2023-04-19
跑nmp命令的时候抛出这个错误(标签-前端)
2023-03-22
json格式和普通数据的转化
2023-03-21
nmp命令错误，网上找了方法也没解决
2023-03-11
li里面掉落咋办，问题出在哪里呀
2022-11-05
TA创建的收藏夹 TA关注的收藏夹
TA关注的人