小编Mag*_*nus的帖子

Angular Routing文档提到了组件实例创建,组件实例激活和路由激活.

文档没有解释这些概念的差异,以及何时发生每个创建/激活.

问题

1. 实例创建和实例激活之间有什么区别？
2. 实例激活和路由激活之间有什么区别？
3. 实例激活是否始终与实例创建同时发生？

总结:目前尚不清楚组件实例激活和路由激活的真正含义,以及它与组件实例创建的关系(特别是时序方面).

已知信息

实例创建

• 当在不同类型的组件之间导航时,组件实例由Angular创建
• 在同一组件的实例之间导航时,默认情况下会重复使用这些实例

实例激活

• 当浏览器的位置URL更改为匹配路径段(例如/ crisis-center)时,路由器会激活相应组件的实例(例如CrisisListComponent)并显示其视图
• 当应用程序请求导航到路径(例如/危机中心)时,路由器激活相应组件的实例(例如CrisisListComponent),显示其视图,并使用该路径的URL更新浏览器的地址位置和历史记录

路线激活

• 在整个文档中提到了一些地方.见下文

Angular Doc References

以下是Angular文档中对上述三个概念的一些提及:

实例创建

默认情况下,路由器在重新导航到相同的组件类型时重新使用组件实例,而不首先访问其他组件.

...

此应用程序不会重复使用HeroDetailComponent.用户始终返回到英雄列表以选择要查看的另一个英雄.没有访问其中的列表组件,无法从一个英雄细节导航到另一个英雄细节.因此,路由器每次都会创建一个新的HeroDetailComponent实例.

链接

实例激活

当浏览器的位置URL更改为与路径段/危机中心匹配时,路由器将激活 CrisisListComponent 的实例并显示其视图.

链接

当应用程序请求导航到路径/危机中心时,路由器会激活 CrisisListComponent 的实例,显示其视图,并使用该路径的URL更新浏览器的地址位置和历史记录.

链接

路线激活

第三条路径中的data属性是存储与此特定路由关联的任意数据的位置.在每个激活的路由中都可以访问data属性.

链接

您还可以使用CanActivateChild防护来保护子路线.CanActivateChild后卫与CanActivate后卫相似.关键的区别在于它在激活任何子路由之前运行.

链接

在英雄细节和危机细节中,应用程序一直等到路线被激活以获取相应的英雄或危机.

链接

如果您通过保护检查,ActivatedRouteSnapshot包含将被激活的未来路由,并且RouterStateSnapshot包含应用程序的未来RouterState.

链接

我对 JavaScript 中的作用域和闭包的概念有很好的理解。

此外，以下站点提供了如何实现 JavaScript 命名空间的示例：

1. 你想知道的关于 JavaScript 作用域的一切
2. JavaScript 中的命名空间

我仍然不明白的是，似乎有多少人混淆了作用域和命名空间的概念。此外，同样的人还经常提到如何不“污染全局命名空间”而不是“在全局范围内创建全局变量/变量”。

问题

• 作用域和命名空间是两个完全不同的概念，这不正确吗？
  • 命名空间：代码分组，使得组内的名称是唯一的，并且不会与其他命名空间中的相似名称发生冲突
  • 范围：定义变量的可访问性。JavaScript 有两个作用域，全局作用域和局部/函数作用域（ES 2015 引入了带let/ 的块作用域const）
• 下面的对象字面量创建了一个新的命名空间是否正确，以bar避免污染全局命名空间（除了foo），但它bar仍然在全局范围内：var foo = { bar: 42 }
• 说“不要创建全局变量以免污染全局命名空间”是不是错了？全局变量 vs 局部变量（作用域）不同于命名空间。正如所见，完全有可能在一个新的命名空间中屏蔽一个变量，并且仍然让它在全局范围内。
• 如果避免污染全局命名空间是我们不应该创建全局变量的唯一原因，那么仅仅创建新的命名空间并仍然保持全局性还不够吗？

很抱歉打败了一匹死马，但我一生都无法理解为什么下面的方法不起作用。

• 放 line-height: 50px
• 放 vertical-align: top
• 我的理解，这应该使线箱50像素高的，然后vertical-align应该根据MDN，能够左右移动内联元素里面。

具体来说：

以下值相对于整行垂直对齐元素：

底部

将元素及其后代的底部与整行的底部对齐。

我试过这两个：

<span style="line-height: 50px; border: 1px solid red; vertical-align: bottom">Some text</span>

和这个：

<div style="line-height: 50px; border: 1px solid yellow">
   <span style="border: 1px solid red; vertical-align: bottom">Some text</span>
</div>

这是我希望将跨度定位在底部的最后一个版本。它说 line-box 应该是 50px，然后vertical-align用于 child span。

PS：请不要只说“使用 flexbox”或类似的。我想了解内部工作原理/从概念上讲为什么上面没有将跨度定位在行的底部。

我正在使用 SCSS 并想在顶部指定一个基于 px 和 rem 值之和的变量。

我知道不可能在 SCSS 变量中组合单位类型，所以我使用calc()：

$navbar-top: calc(40px + 1 rem);

在样式表的更下方，我想包含一个否定版本的$navbar-top.

我尝试了这两个，但没有成功：

(-$navbar-top)
-#{$navbar-top}

知道如何否定 SCSS 变量，而不必声明新变量，或在整个 CSS 中再次编写 calc 。

谢谢。

编辑

• 正如下面的评论中所指出的，这不是Sass 负变量值的重复吗？
• 这个问题是关于用 calc() 否定一个变量集，这与上面的 SO 帖子无关。我已经注意到上面那个问题中提出的两种解决方案。在这种特殊情况下，它们都不起作用。

编辑 2：基于下面 TEMANI 的回答的 SCSS 解决方案

在顶部声明必要的变量，包括“否定”（-1）：

$navbar-top: calc(40px + 1rem);
$neg: -1;

然后，该变量可以在整个过程中使用（否定或不否定），如下所示：

/* Non-negated */
margin: $navbar-top 0 0;

/* Negated */
margin: calc(#{$neg} * #{$navbar-top}) 0 0;

上面的否定版本将编译为以下 CSS：

margin: calc(-1 * calc(40px + 1rem)) …

阅读ECMAScript 规范，似乎环境记录（词法环境的组件）和引用都用于确定 anIdentifier绑定到哪个变量/函数。换句话说，找到 Identifier 所代表的实际值。

我注意到 aReference的Base value组件可以包含Environment Record：

基值组件可以是未定义的、对象、布尔值、字符串、符号、数字或环境记录。

但是，我不清楚何时使用 aReference而不是直接读取Environment Record当前的执行上下文（由s组件Lexical Environment给出）。running execution contextLexicalEnvironment

编辑：

在接受@Bergi的回答后，我想添加一些我不明白的事情，以防它对未来的读者有所帮助：

1. ECMAScript 中的标识符查找始终返回Reference类型
   • 要解析变量/函数名称，我们从8.3.2 ResolveBinding开始
   • 您将看到首先检查了running execution context's LexicalEnvironment（其环境记录）
   • 如果未找到匹配项，则向外跟踪词法环境链，直到找到匹配项（或未找到匹配项）
   • 链的末端为global environment，其外部环境为null
   • 一旦找到匹配项，Reference就会返回一个类型，该类型的base value值设置为匹配的环境记录中的名称值
   • 如果未找到匹配项，则返回Reference带有base valueof的 aundefined
   • 因此，标识符查找总是需要检查环境记录并Reference在最后返回类型 …

CSS2.1第10.6.1节规定：

内容区域的高度应基于字体，但是此规范未指定。UA可以例如使用em-box或字体的最大升序和降序。

内联不可替换框的垂直填充，边框和边距从内容区域的顶部和底部开始，与“ line-height”无关。

然后，在10.8行高计算中遵循似乎矛盾的语句：

线框的高度确定如下：

1. 计算行框中每个行内框的高度。对于嵌入式盒，这是它们的“行高” ...。

和：

用户代理必须通过其相关基准使未替换的嵌入式框中的字形彼此对齐。

内联框的高度将所有字形及其两边的前导部分包围起来，因此正好是“行高”

在这里，我有些不完全了解。

内联级别框的高度等于line-height它们上设置的属性（最小是line-height在父块容器元素上设置的属性），还是仅由字体高度（和UA实现）确定？

编辑

只是为了避免造成混淆（因为有很多与此相关的帖子）：

• 我知道一个inline-level element的内容高度等于它包含的字体（以及UA实现）
• 我意识到规范确实指出10.6.1，但10.8.1其中指出的高度inline-level box等于的高度line-height
• 这似乎与我矛盾
• 我在这篇文章中的目的是讨论规范中的措辞，以便充分理解其含义以及它与现实的联系

编辑：

为了避免“基于意见”的接近投票，我更改了标题。我认为规范不矛盾，我也不是在征求其他人关于它是否矛盾的观点。

我意识到它实际上并不矛盾，我只是试图理解它的含义（鉴于其措辞）。

我在理解为什么 C++ 中需要 #include 和 LoadLibrary() 时遇到了一些麻烦。在 C++ 中，“#include”强制预处理器将 #include 行替换为您包含的文件的内容（通常是包含声明的头文件）。据我了解，这使我能够在标头所属的外部库中使用我可能想要的例程。

为什么我需要 LoadLibrary()？我不能只#include 库本身吗？

顺便提一下：在我更熟悉的 C# 中，如果我想在我的程序中使用来自该 DLL 的类型或例程，我只需添加对 DLL 的引用。我不必 #include 任何东西，因为 .NET 框架显然会自动搜索所有引用的程序集以查找我要使用的例程（由命名空间指定）

非常感谢您提前。

编辑：使用“定义”一词，但表示“声明”。现在固定了。

编辑 2：很难选择一个答案，很多很好的回复。感谢所有贡献。

以下MDN文章讨论了CORS头:跨源资源共享(CORS)

我的问题很基本:

给定simple request(不preflighted):添加CORS headers服务器端有什么意义,如果我们发送所请求的资源与HTTP response无关(即发送资源与消息相同CORS response headers)？我认为,CORS headers如果服务器允许,UA只能接收所请求的资源.

发送或不发送资源会不会更容易,具体取决于哪个客户端要求？

来自Next.js 文档：

警告：服务器组件当前不支持需要运行时 JavaScript 的 CSS-in-JS 库。

应用程序目录中的客户端组件支持以下库：

• styled-jsx
• 样式组件
• 风格9

问题

1. 这是否意味着我必须use-client在每个使用StyledComponents 的组件中使用该指令？
2. 如果是这样，是否可以将所有StyledComponent写入一个文件中，并将use-client指令放在顶部，然后根据需要将这些客户端组件导入到服务器组件中？
3. 上述方法是否会以某种方式将服务器组件转变为客户端组件？
4. Next.js 文档声明目录中的所有组件默认app都是服务器组件。如果我们在目录外保存一个组件app并将其导入到该目录中的服务器组件app中，那么该导入的函数是否也会成为服务器组件？

在梳理了SVG 规范以及诸如此类的指南之后，我仍然在努力理解链接变换的工作原理。

精选相关报价

\n

When you apply the transform attribute to an SVG element, that element\n gets a "copy" of the current user coordinate system in use.

\n

And:

\n

When transformations are chained, the most important thing to be aware\n of is that, just like with HTML element transformations, each\n transformation is applied to the coordinate system after that system\n is transformed by the previous transformations.

\n

And: …