Theme 组件的 j/s 执行顺序由什么控制?

我的主题中包含 JavaScript(我是不是已经臭名昭著了?;)),它通过 api.decorateCooked(… 修改 DOM,动态添加元素。它会插入各种 HTML head 元素。

我还安装了 DiscoTOC 主题组件。

然而,添加 DiscoTOC 能识别并展开的常规 <div data-theme-toc="true"></div> 后,生成的目录并不包含我动态插入的元素。

我猜测这可能只是执行顺序的问题……如果 DiscoTOC 在我通过 JavaScript 添加更多元素之前就进行了处理……

当多个主题 JavaScript 代码片段都调用 api.cooked( 时,执行顺序是由什么决定的?

顶一下?:slight_smile:

再加一点无厘头内容凑够 20 个字符

请注意,DiscoTOC 仅在帖子内容中运行——如果您在帖子外部插入这些元素,它将无法检测到它们。

我认为我们尚未需要定义 JS 的执行顺序。

我是在帖子内部插入的,没错。所以我怀疑是执行顺序的问题。

有一段代码决定了执行顺序……这就是我让组件在目录(TOC)之前加载的关键点。例如,如果是按组件名称的字母顺序排列(即管理后台组件列表中显示的顺序),那我就可以尝试相应地命名我的组件,以此类推。

我很确定组件的执行顺序并非基于组件名称。默认情况下,它是基于 ID 的。

不过,对于高级用例,你确实可以设置初始化器的顺序。我可以将 DiscoTOC 放入一个命名的初始化器中,这样你就可以在 DiscoTOC 之前运行你的代码。但首先我需要了解你想做什么,才能给你一个明确的答复。

你这里的修改是基于 HTTP/AJAX 请求,对吗?

是的,使用 AJAX,但采用的是同步调用。(我一直很喜欢“同步 AJAX”这个自相矛盾的说法 :^)

我觉得下一步是创建一个真正的组件——目前它只是被我粘贴到主题头部的一些 JavaScript 代码。然后我可以尝试调整一个精心挑选的 ID。“_foo”或"0-foo”可能就足够了。

谁说不是呢 :wink:

没错。如果你想使用具名初始化器和初始化顺序,你的组件需要在 /javascript 文件夹中拥有一个初始化器。

不过别担心,我可以帮你搞定所有这些。我明天会给你一个完整的答复。

不久前,我将我的 j/s 破解改造成了一个主题组件。

我很想回到让我的组件在 Discourse table-of-contents 之前运行的排序问题上。

我记得,主题组件是在插件之后进行评估的。

可能记错了,但它们是按名称顺序加载的,所以在名称前加上 x- 过去曾帮助我确保特定的主题组件最后被评估。

没关系。我正在尝试调整 DiscoTOC(https://github.com/discourse/DiscoTOC.git)组件和我自己创建的组件的顺序。

其他人的回复表明组件的_名称_不会影响执行顺序。我刚刚将它们重命名为 aa-mycomponent 和 x-last-DiscoTOC,但它不起作用。[DiscoTOC 不包括动态添加到 DOM 的标题——是的,在帖子正文中]

https://forum.moversmindset.com/t/list-of-movers-mindset-podcast-episodes/1160

@Johani 从你五月份的思路中还有其他想法吗?

hmmmmmmm… 也许问题不仅仅是排序。我刚刚检查了一下……我以为是 HTML 标题的东西在 DOM 中实际上是带有 class=\"d-toc-ignore\" 的 DIV 标签。

是时候深入挖掘了。我的 标题 去哪儿了? :slight_smile:

嗯,我认为你可以通过尝试一个非常简单的例子来证明这一点。

创建两个简单的组件,覆盖或连接同一个东西,也许是一个带有细微差别的简单模板,给其中一个起一个字母表中靠后的名字,注意哪个组件最终会覆盖主题。

这里的代码非常清楚地按名称排序:

名称不影响执行顺序。@merefield 您链接的行会影响它们在管理员 UI 中的显示方式,但并不用于实际执行。

这是与执行顺序相关的行:

因此,它们将按数据库中“id”的升序执行。

在 Discourse 实例之间可移植的唯一保证是,主题代码始终在主题组件代码之前执行。

正如 @Johani 在上面提到的,如果您需要在使用其他组件加载后运行代码,最好的方法可能是使用 Ember initializer,它支持排序。不幸的是,在这种情况下,这可能无法立即实现,因为 DiscoTOC 似乎没有使用 Ember initializer。将 DiscoTOC 更新为使用多文件 JavaScript(因此是 Ember initializer)当然是 #pr-welcome。

这很不幸,因为它可能很有用。无论如何,感谢您的澄清!

(……这与 Theme component order of precedence 相关)

只是回来再说一下,数据库 ID 的优先级确实有效;解决了我的需求。谢谢大家!