- 博客(27)
- 收藏
- 关注
原创 Vue 3 ,watch
直接监听ref或reactive对象:适用于简单的监听需求,不涉及复杂逻辑,性能稍优。使用 getter 函数监听:适用于需要监听多个响应式属性或计算属性,或者需要对监听的目标进行逻辑处理的情况,提供了更大的灵活性。选择哪种方式取决于你的具体需求。如果你只是监听一个简单的ref或reactive对象,直接监听通常是最简单和高效的方式。如果你需要更多的灵活性或复杂的逻辑,使用 getter 函数则是更好的选择。希望这能帮助你理解两者之间的区别!如果有更多问题,请随时提问。
2024-12-30 15:42:45
326
原创 The “next“ callback was called more than once in one navigation guard when going from ....
这个警告信息表明,某个导航守卫(中的回调函数 被调用了一次以上。在 Vue Router 中, 函数只能在一个导航守卫中调用一次。多次调用 可能会导致不可预测的行为,而且在生产环境下这种行为是不允许的,会导致错误。要解决这个问题,你需要检查你的导航守卫逻辑,确保 函数只被调用一次。以下是可能的一些修正方案:确保你的守卫逻辑不会导致多次调用 。例如:2. 使用 或 如果需要取消当前的导航,可以调用 或者重定向到另一个路由:3. 分离守卫如果有多个条件需要检查,可以考虑分离不同的导
2024-09-26 09:44:01
1267
原创 Vue2 后端返回 ‘/n’ 换行文本,v-hml不起效果
指令,以在 HTML 中渲染处理后的文本,这时。指令用于输出原始的 HTML,但它不会自动将。在页面上显示为换行,你需要在将数据传递给。因此,如果你从后端接收到的文本包含。来处理这个文本,将所有的。就被正确地显示为换行了。是从后端接收到的包含。
2024-07-11 16:05:05
656
原创 React的useEffect Hook中清理函数
这个返回的函数通常被称为“清理函数”(cleanup function)或“effect的清除”(effect cleanup)。Hook,每个都有自己的清理逻辑。然而,在某些情况下,你可能需要在组件卸载之前执行。再次执行(由于依赖项数组中的值改变)之前被调用,作为清理逻辑。Hook中,如果你返回一个函数,那么这个函数会在组件卸载或。,并且每个Hook都需要自己的清理逻辑,那么你应该在每个。),并在返回的清理函数中分别清理了它们。在上面的例子中,我们创建了两个资源(在这个例子中,我们有两个独立的。
2024-06-28 15:40:35
557
原创 React 使用 Hook,只能在函数组件的顶层调用 Hooks
如果你需要在条件语句或循环中使用状态或副作用,你应该将这部分逻辑提取到一个新的组件中,并在该组件内部使用 Hooks。如果在循环、条件或嵌套函数中调用 Hooks,就可能会破坏这个顺序,导致 React 无法正确地将状态、更新函数或副作用与组件的特定渲染关联起来。以下是一个例子,展示了在条件语句中调用 Hooks 可能会导致的问题(尽管这样做在 React 中是不允许的,但为了解释目的,我会假设它能够运行)React 依赖于每次渲染时 Hooks 的调用顺序,但在条件语句中,在上面的例子中,如果。
2024-06-19 14:13:15
402
原创 AJAX - onreadystatechange 事件 readyState属性 status属性使用逻辑
事件用于在的readyState属性发生变化时执行某些操作。你通常会在这个事件处理器中检查readyState是否为4(即请求已完成),然后进一步检查status属性以确定请求是否成功。status属性用于获取服务器响应的 HTTP 状态码。你应该在readyState为4时检查它。一句话:先看你的请求(readyState)是否正常,再看你请求服务端响应(status)是否正常,然后进行你的业务操作...。
2024-05-28 11:25:27
441
原创 Vue 菜单避免重复跳转
在 Vue 中,如果你使用 Vue Router 进行路由管理,并且希望在用户已经位于某个页面时再次点击该页面的菜单项时不再进行路由的。操作(即不再往路由历史中添加新的记录),你可以通过监听路由变化或者检查当前路由路径来实现这一逻辑。方法负责处理菜单项的点击事件。它首先检查目标路径(这里是一个简单的示例,展示了如何使用 Vue 的。如果相同,则不执行任何操作。
2024-05-25 16:30:09
255
原创 Naive UI ——Data Table表格省略提示样式修改
-------------------------------------------------------寻找过程------------------------------------------------------------:'css代码...'
2024-01-08 15:53:28
805
1
原创 get请求浏览器URL转码 +2023年12月22日14:13:17格式,decodeURI 和decodeURI 推荐decodeURIComponent
url转码
2023-12-22 14:14:06
543
原创 Vue3: A watch source can only be a getter/effect function, a ref, a reactive object
watch用来监听特定数据源,并在单独的回调函数中执行副作用。默认是惰性的——即回调仅在侦听源发生变化被调用。
2023-10-24 10:00:00
1252
原创 JavaScript 过滤数组对象属性值是 null 、undefined、“ “(空字符串) 的属性
函数,我们可以传递一个对象和一个谓词函数。谓词函数用于判断属性值是否为 undefined、null 或空字符串 “”,返回 true 则表示需要被排除,因此这些属性将被过滤掉。2.使用 Lodash 库可以很方便地过滤掉 JavaScript 对象中的属性值为 undefined、null 和空字符串 “”。如果您想过滤掉 JavaScript 对象中的非真值(例如 false、0、空字符串等)属性,并返回一个新的对象,您可以使用。方法来遍历对象的每个属性,并结合。方法来遍历对象的每个属性,并结合。
2023-09-23 14:45:55
1401
原创 前端 JS生成32位UUID (安全的随机数)
函数,但这种方法受限于浏览器的兼容性,只在较新的版本(Chrome>=11.0, Firefox>=21, Edge, IE>=11, Safari>=3.1)可以使用。JavaScript的`Math.random()`实现PRNG(伪随机数序列发生器),该PRNG是可移植和可重复的,因此如果两个`Math.random()`使用相同的种子,会生成相同的数值序列。JavaScript在安全性要求较高的环境中生成随机数,常规的建议是使用 Mozilla API 中的`例如:下面的代码使用。
2023-09-20 11:23:38
1565
原创 动态修改props数值
vue报错use a data or computed property based on the prop's value
2023-09-08 14:17:40
473
原创 Vue 递归循环(标签项)
这样,通过递归的方式,我们可以循环地输出包含子项的数据结构。请注意,为了避免无限递归,需要在递归组件中判断是否存在子项并控制递归的条件。),然后检查它是否有子项,如果有,则使用递归的方式将子项作为新的。在这个示例中,我们创建了一个递归组件RecursiveList。的数组,该数组包含了需要循环输出的数据。,对于每一个项,首先输出该项的名称(组件,以便进行嵌套循环输出。
2023-07-12 11:14:43
535
原创 Js动态拼接对象、添加属性
放在点符号后面,我们可以动态地指定属性的名字,并将其赋值为变量value。方法将一个新对象和一个拥有动态键值的对象合并在一起。不同的是,我们使用方括号符号来包裹变量key。作为第一个参数,可以确保创建一个新的对象。来动态添加一个名为name。来动态添加一个名为name。,以动态地指定属性的名字。此方法也是使用变量key。二、动态添加对象属性。
2023-07-12 10:57:19
2728
原创 vue 互斥按钮(单选两种状态)
1.并根据按钮的 active 属性来设置按钮和图片的选中状态。在点击按钮时,调用 click 事件来更新按钮的选中状态。如果点击的按钮的 id 与当前选中的按钮的 id 相同,则将当前按钮的 active 属性设为 true,其他按钮的 active 属性设为 false。2.当点击 button1 后,我们需要把 button2 的状态设为相反的状态,即当 button1 选中时,button2 必须不选中,反之亦然。
2023-06-17 18:39:58
1179
原创 webPack使用url-loader和html-loader
img标签 [object Module]module: { rules: [ { test: /\.less$/, // 要使用多个 loader 处理用 use use: ['style-loader', 'css-loader', 'less-loader'] }, { // 问题:默认处理不了 html 中 img 图片
2021-08-17 10:07:01
413
原创 MarkDown练习
MarkDowm 练习MarkDown 是一种轻量级标记语言,它允许人们使用易读易写的纯文本格式编写文档。MarkDown 语言在 2004 由约翰·格鲁伯 (英语: JohnGruber) 创建。Markdown 编写的文档可以到处 HTML 、 Word 、图像 、PDF 、Epub 等多种格式的文档。MarkDown 标题使用 = 和-标记 一级和二级标题我展示的是一级标题===============我展示的是二级标题显示效果如下:我是一级标题我是二级标题使用
2020-11-26 10:52:40
622
原创 Model去掉footer
Model只要页眉不要页脚去掉iview Modal组件中的取消和确定按钮如下图所示:Modal对话框可通过solt 自定义页头 / 页脚 / 右上角关闭内容 (header / footer / close)实现去除“取消” 和“确定”按钮可通过自定页脚,其代码如下:方式一:slot = “footer”<Modal v-model = "modal1" title = "Common Modal dialog box title">
2020-11-25 14:29:44
2389
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人