- 博客(98)
- 问答 (5)
- 收藏
- 关注
RSS订阅转载 【react】useState无法立即更新值
useState的set操作是异步的，不能立刻取到新值，如果想立刻取到新数值，只能额外再定义一个useRef变量作为副本，在进行set操作的同时更新useRef变量的数值，useRef变量.current可以立刻取到(使用useRef是因为函数组件内不应该使用var/let定义变量,异步操作获取var/let变量数值取到的永远都是最初默认值，例如在click事件中)原文链接：https://blog.csdn.net/zhbzhb324/article/details/134152997。
2024-09-15 23:30:47
96
转载 react 引入阿里矢量图标库并封装
阿里矢量图标库是国内功能很强大且图标内容很丰富的矢量图标库，提供矢量图标下载、在线存储、格式转换等功能，是阿里巴巴体验团队倾力打造，设计和前端开发的便捷工具。在很多项目中，我们会使用到大量的小图标，这种情况下，使用字体来实现图标就有很多优势：字体文件小；注意，这里的typename为项目图标下面对应的名称，对应写入即可。添加之后，项目详细信息如下，在这里可对图标颜色进行调整，调整好后下载至本地。搜索所需要的图标添加入库，点击购物车图标选择将所选图标添加至应用的项目。至此，Icon组件封装完成，调用如下。
2024-08-31 19:51:59
128
转载 react useEffect中的内容被执行两次
严格模式的主要目的是帮助开发者发现和修复潜在的问题，以便在生产模式下运行的应用能够更加稳定和高效。然而，需要注意的是，严格模式只在开发模式下生效，在生产模式下不会产生任何影响。标签中时，React 会对该组件及其子组件进行多次渲染，以检测潜在的问题。这些问题可能包括使用已废弃的 API、依赖不稳定的生命周期方法、以及在渲染过程中产生副作用等。严格模式（Strict Mode）是 React 中的一种特殊的组件，它用于在开发模式下检测潜在的问题。当第一次执行后，就把flag关掉，就不会再执行了。
2024-08-07 17:43:46
154
转载 vite+vue3 proxy配置代理服务器解决本地运行跨域问题
是由浏览器的同源策略造成的，是浏览器对JavaScript实施的安全限制，是浏览器的行为。原文链接：https://blog.csdn.net/qq_37656005/article/details/129056780。在打包后，部署后tomcat下，还是会跨域，所以想要彻底解决问题，还是需要后端接口代码加上跨域的相关配置。在本地想请求后端的 一个接口 “http://xxx/test”，proxy配置如下。特别是前后端分离的模式下，由于前后端域名不一致，就会出现跨域问题。// http 是协议。
2024-06-04 16:24:03
845
转载 html 文本换行 \n 没有生效
本中直接用 \n ，无法换行，因为 html 不识别 \n，如果只是单纯的用 replace 把 \n 换成 <br/>，只能变成普通的字符串，也还是无法换行。原文链接：https://blog.csdn.net/lizhi1030/article/details/126990490。用 innerHTML = " ... " 或者 v-html 来把 <br/> 识别为 html node。给要换行的元素，加上样式white-space: pre-line;在标签上套一个 <pre></pre>
2024-03-20 20:22:04
1502
转载 Vue3 使用watch监听被赋值的数组问题
当页面操作改变了arr时(不重新赋值, 使用push, splice等方法改变数组), 可以正常出发watch函数, 但是你会发现now和old输出的值是一样的, 这个还可以接收, 至少能触发watch函数, 但是你一旦重新给arr赋值了, 比如给arr数组清空了 test.arr = [];如果是对象的话使用下面的写法,但是比较遗憾, 这里的now和old都是一样的值(改变单一属性的情况下)在vue3中使用watch的时候需要注意的事项很多, 其中需要一项需要注意的是在监听数组的时候。
2024-03-18 18:01:32
406
转载 Vue3 列表无限滚动vue3-infinite-scroll
vue-infinite-scroll的vue3版本,所有用法和一致。其代码也是基于它做了简单修改，并修复了一些bug，比如重复两次请求等问题。API参数 说明 类型 默认值。
2024-03-17 22:20:12
834
转载 Vue3 - 解决项目启动后浏览器无法访问问题（Network: use --host to expose）
（4）使用浏览器访问“http://localhost:5173”无法打开页面，提示“无法访问此网站localhost 拒绝了我们的连接请求。根据“Network: use --host to expose”提示，要求服务使用 host 来进行暴露，即要将服务暴露成“IP + 端口号”进行访问。（1）首先修改 package.json 文件，将启动项中的 dev 和 serve 增加 --host 参数。（3）上述命令执行后，控制台显示“Network: use --host to expose”
2024-03-10 14:23:01
4153
原创 vue3+uniapp 上传附件
因为始终怎么限制，uni-file-picker绑定的v-model的值fileList,好像只要上传了文件展示就一定会回显那一个附件。还有一个问题，就是上传的进度条并不能正常工作。直接css隐藏算了眼不见心不烦。多次试图驯服该组件，发现如果要把上传好的文件列表同步给父组件，就不要去传组件绑定的value值，因为这会出问题，把这个变量当做单纯展示的作用就好了，父子组件的数据传输，可以用双向绑定，文件的增删改都操作这个双向绑定的数据。子组件：封装的文件上传。
2024-01-08 14:30:45
1073
原创 uniapp H5 navigateBack无法返回上一层级
H5在PC端打开，当前页面重新加载的情况下，出现navigateBack不能返回，由于H5端页面刷新后返回页面栈会消失。提交表单后需要返回上一级。
2023-09-13 10:37:48
1285
原创 el-upload 同时选取多文件上传，文件列表却只传了一个
通过查看控制台发现on-success方法在上传文件时，只执行了一次。返回的两个文件，其中一个状态是uploading。而我们取文件又只取了status是success的文件。背景：使用element的上传组件，在使用多文件上传时，发现如果同时选择两个文件，上传完成之后，upload组件的列表只显示一个文件。解决：重点在于on-success中的那句文件列表上传状态的判断 （Vue3版本）
2023-08-15 16:14:43
1997
原创 element-plus无法清除表单验证
还可以给el-dialog设置@open="方法名" .在打开对话框时再清除一次。在打开对话框时，对话框内的表单验证还是存在。
2023-08-01 09:41:25
822
转载 路由退回到之前的页面后数据不刷新
有两个页面A和B，我们使用单页面的形式，使用vue-router来实现页面的“跳转”，当我们一开始打开A页面时，执行了页面的created和mounted，跳转到B页面，执行了B页面的created和mounted，但是，当我们从B页面“跳转”回A页面时，我们发现不会执行created和mounted了，因为这个Vue组件已经加载了，它不会重复执行方法，如果我们要在路由发生变化的时候执行方法，那我们就需要监听$route的变化，在它变化的时候执行方法。
2023-07-06 17:37:37
3409
原创 判断element-plus表单是否修改过（对比两个对象是否一致）
vue3对象通常是ref或者reactive响应式对象，不能直接进行对比两个对象是否一致，可以转化为字符串后在对比。
2023-06-16 14:29:24
735
转载 JS 两个含有部分相同属性的对象如何快速赋值
方法三：不需要的属性放前面，obj3就是剩下的。将一个对象的部分字段值赋值给另一个对象。方法一：字段多，只取部分值。方法二：全部字段赋值。
2023-06-15 15:50:51
1010
转载 vue3刷新当前页面
链接：https://juejin.cn/post/7096744577071054879。商业转载请联系作者获得授权，非商业转载请注明出处。使用（provide/inject）刷新页面交互体验比较好。
2023-06-08 11:05:48
1183
原创 Webstorm中项目代码从git的master分支切换到develop分支
如果在gitlab中新建了分支，但是在Git Branches中Remote Branches中看不到新建的那个分支，可以执行如下操作。当前为master分支，需要切换到develop分支，master不允许推送。选中项目右键--Git--分支。在分支中点击目标分值，点击签出。此时，就切换到了dev分支。
2023-03-10 09:37:13
1790
原创 git删除本地版本库
按理说直接删除项目中.git文件即可，但是这个文件是隐藏的，所以可以借助软件everything查找到隐藏的.git文件，直接删除！随便搜的一个链接，不对其安全性负责。
2023-03-06 16:16:50
385
原创 Vue项目页面回到顶部
注意：这个组件想显示出来，必须放到产生滚动效果的元素内部，且是放到最上面！所以必须明确是哪个元素有的滚动条（也许不是body元素）（假如这里是有个类名叫content-view的元素产生的滚动）注意：利用api回到顶部是没有滚动动画的，直接一下就到了。回到顶部组件（点击按钮缓慢回顶部）
2023-01-06 14:16:19
2095
原创 Vue3子组件未获取到父组件异步得来的数据
原因是父组件异步操作获取数据是在传给子组件值之前，解决方法就是把这个异步数据用ref定义，不用reactive定义。（若父组件用reactive定义时，我在子组件watch监听props无效）父组件调用接口获得数据，并传给子组件。但是子组件并没有得到父组件调接口后的最新数据，而是初始数据。这下子组件不需要监听，得到的值直接是最新的（实在不行还是可以用watch监听一下）
2022-12-26 15:35:25
2269
转载 js中的 可选链操作符、空值合并操作符、空值赋值运算符、非空断言操作符
)允许读取位于连接对象链深处的属性的值，而不必明确验证链中的每个引用是否有效。. 操作符的功能类似于 . 链式操作符，不同之处在于，在引用为空(null 或者 undefined) 的情况下不会引起错误，该表达式短路返回值。=左侧的值为null、undefined的时候,才会将右侧变量的值赋值给左侧变量.其他所有值都不会进行赋值.同样在一些场景下,可以省略很多代码.）是一个逻辑操作符，当左侧的操作数为 null 或者 undefined 时，返回其右侧操作数，否则返回左侧操作数。1.可选链操作符(?
2022-12-21 16:00:54
682
原创 持久化 pinia 状态
localStorage中，只是插件会帮助自动存入与取出，不需要自己去操作localstorage。pinia-plugin-persistedstate或者pinia-plugin-persist都无效！pinia的状态与vuex一样把数据存在内存中，在刷新页面后会清理内存，数据会丢失。在需要使用store的页面修改数据的时候，不要使用赋值解构取出，而是直接取出并修改。要解决这个问题非常简单，在状态改变时将其同步到浏览器的存储中，如。插件来实现持久化，原理也是把数据存入。
2022-12-13 18:14:10
4102
2
转载 css的元素:focus伪类不生效
遇到一个需求，在vue项目中根据a标签那样的链接跳转效果来实现组件的切换，于是乎打算通过给div设置伪类:focus来模仿a标签被点击后变色的效果，但是当给div设置伪类:focus后发现并没有生效。tabIndex属性：利用tab键遍历页面的表单元素和链接，按照tabindex的大小决定顺序，同时也有指示其元素是否可以聚焦（获得焦点）的作用。:focus ：在元素获得焦点时向元素添加特殊的样式（如果是给元素设置颜色样式的话，被点击后变色，且颜色在点击后不消失）
2022-11-28 13:56:56
4277
转载 【element-plus】el-popover 点击按钮关闭弹出框
但是如果绑定了visible，那么弹出框所有的弹出隐藏都必须手动控制 ，也没有点击空白处隐藏弹出框了。所以还是不设置visible属性。需求：用户点击按钮，弹出框出现，弹出框里有确认&取消按钮，点击确认&取消&其他区域，弹出框消失。链接：https://www.jianshu.com/p/3b2380a3920d。可以通过绑定弹出框的ref，来通过ref的value.hide()实现手动隐藏。商业转载请联系作者获得授权，非商业转载请注明出处。
2022-11-27 17:01:33
9801
16
空空如也
今年前端react岗位变多了吗?
2024-07-09
按键fn的keycode为什么获取不到
2024-06-23
webstorm设置忽略包文件失败
2023-02-23
这个注释是怎么快捷键打出来的(开发工具-ide)
2023-02-08
webstorm如何让ts显示中文提示
2022-10-12
webstorm的translation插件抽风了！！
2022-03-15
请问这个名叫forest-ext-shadow-host的盒子怎么来的
2022-03-01
请问webstorm如何设置bootstrap自动提示
2022-02-14
请问为什么css滚动条无法拖动呢
2021-12-22
请问加了鼠标跟随后元素无法被选中如何解决
2021-12-14
TA创建的收藏夹 TA关注的收藏夹
TA关注的人