vue中destroyed应用于啥场景?
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了vue中destroyed应用于啥场景?相关的知识,希望对你有一定的参考价值。
参考技术A在 Vue 中,destroyed 生命周期钩子函数应用于以下场景:
清理定时器和事件监听器:在组件销毁时,需要清除所有在组件中创建的定时器和事件监听器,避免因为未清理而导致内存泄漏。
取消异步请求:如果组件中使用了异步请求,需要在组件销毁时取消这些请求,以免因为异步请求未完成而导致数据混乱或者浪费网络资源。
清理非响应式的组件状态:在某些情况下,组件中可能会存在一些非响应式的状态(即不在 data 中声明的变量),例如计时器的标志位等。在组件销毁时,需要手动清理这些状态,以免影响其他组件或者重新创建组件时出现问题。
取消订阅事件:如果组件中订阅了事件或者消息通信,需要在组件销毁时取消这些订阅,避免出现内存泄漏。
总之,在任何需要清理组件的操作或者资源时,都可以使用 destroyed 生命周期钩子函数来释放相应的资源和状态,以保证组件正常销毁并释放内存。
在 CSS 文件中使用相对 URL,它相对于啥位置?
【中文标题】在 CSS 文件中使用相对 URL,它相对于啥位置?【英文标题】:Using relative URL in CSS file, what location is it relative to?在 CSS 文件中使用相对 URL,它相对于什么位置? 【发布时间】:2010-10-30 17:45:08 【问题描述】:在 CSS 文件中定义诸如背景图像 URL 之类的内容时,当使用相对 URL 时,它相对于哪里?例如:
假设文件/stylesheets/base-styles.css
包含:
div#header
background-image: url('images/header-background.jpg');
如果我通过 <link ... />
将此样式表包含到不同的文档中,CSS 文件中的相对 URL 是否会相对于 /stylesheets/
中的样式表文档 或 相对于当前文档它包含到?可能的路径,例如:
/item/details.html
/about/index.html
/about/extra/other.html
/index.html
【问题讨论】:
【参考方案1】:根据W3:
部分 URL 被解释为相对于样式表的来源,而不是相对于文档
因此,在回答您的问题时,它将与/stylesheets/
相关。
如果您考虑这一点,这是有道理的,因为 CSS 文件可以添加到不同目录中的页面中,因此将其标准化为 CSS 文件意味着 URL 将在样式表链接的任何位置起作用。
【讨论】:
看起来规则有一个例外:-ms-behavior
in IE :(
还有一个例外:当 url 是自定义属性的默认值时。假设您定义了.banner background-image: var(--bgimg, url('images/default.jpg'));
,但还没有为--bgimg
定义值。然后在页面/index.html
上,.banner
将查找/images/default.jpg
,但在另一页/about/index.html
上.banner
将查找/about/images/default.jpg
。非常破碎的海事组织。
更正:Chrome v60修复了上述默认值bug。
如果你的 css 在一个包中,那么路径真的无关紧要。它不是你想的那样,没有什么是相对的了。
我在使用属性时遇到了问题:background: var(--primary-color-background) no-repeat center center url("maps.jpg");
这在 IOS 和 Safari 中不起作用。只有绝对路径 /resources/maps.jpg
在 Safari 中与 css 属性结合使用。【参考方案2】:
它与 CSS 文件有关。
【讨论】:
【参考方案3】:它与样式表相关,但我建议将 URL 设为相对于您的 URL:
div#header
background-image: url(/images/header-background.jpg);
这样,您可以移动文件,而无需在未来重构它们。
【讨论】:
前面多出来的“/”有什么区别? 就像命令行中的路径名一样,路径前面的 / 表示它指向当前 Web 服务器上的绝对资源。 实际上有一种情况,使用相对于 CSS 文件的 URI 会更好。就我而言,我有一个目录“/css/”,其中放置了所有 CSS 数据。现在,我想在一个单独的文件夹中测试网站上的新功能。很难测试,例如测试文件夹中的新背景图像。这完全取决于您的需求... 绝对路径使得很难将解决方案放在域的子文件夹中。您想要支持子文件夹的原因有很多。它使测试变得更容易(正如 Diego 所提到的),您可以将以前的版本/预发布版本与 prod 放在同一个域中。企业代理服务器设置为支持 SSO、将所有解决方案移至一个域等的未来变化。尤其是使用 SSL,可能希望避免维护多个域名的开销。对我来说,这些考虑比“更容易移动我的 .css 文件”更重要。 图像和类似的东西无论如何都会进入 cdn,所以这是完美的【参考方案4】:为了创建不依赖于资源绝对位置的模块化样式表,作者可以使用相对 URI。相对 URI(定义在 [RFC3986] 中)使用基本 URI 解析为完整 URI。 RFC 3986 第 5 节定义了此过程的规范算法。对于 CSS 样式表,基本 URI 是样式表的,而不是源文档的。
例如,假设以下规则:
body background: url("yellow")
位于由 URI 指定的样式表中:
http://www.example.org/style/basic.css
源文档的 BODY 的背景将与 URI 指定的资源所描述的任何图像平铺
http://www.example.org/style/yellow
用户代理在处理无效 URI 或指定不可用或不适用资源的 URI 的方式上可能会有所不同。
取自CSS 2.1 spec。
【讨论】:
【参考方案5】:For CSS style sheets, the base URI is that of the style sheet, not that of the source document.
(其他任何东西都会被破坏,IMNSHO)
【讨论】:
【参考方案6】:使用自动最小化 css 时可能会出现一个问题,并且似乎会破坏这个问题。缩小包的请求路径可以具有与原始 css 不同的路径。这可能会自动发生,因此会引起混淆。
缩小包的映射请求路径应该是“/originalcssfolder/minifiedbundlename”,而不仅仅是“minifiedbundlename”。
换句话说,将您的包命名为与原始文件夹结构具有相同的路径(使用 /),这样任何外部资源(如字体、图像)都将映射到浏览器的正确 URI。另一种方法是在你的 css 中使用绝对 url( refs 但这通常是不可取的。
【讨论】:
这为我节省了大量时间!谢谢。应该记录更多【参考方案7】:尝试使用:
body
background-attachment: fixed;
background-image: url(./Images/bg4.jpg);
Images
是存放您要发布的图片的文件夹。
【讨论】:
以上是关于vue中destroyed应用于啥场景?的主要内容,如果未能解决你的问题,请参考以下文章
请简要描述一下hadoop,spark,mpi三种计算框架的特点以及分别适用于啥样的场景