# renderInOutlet遇到问题

**URL:** https://meta.discourse.org/t/trouble-with-renderinoutlet/359690
**Category:** Development
**Created:** [2025年三月31日 18:14 UTC](https://meta.discourse.org/t/trouble-with-renderinoutlet/359690 "2025-03-31T18:14:10Z")
**Posts on this page:** 8
**Page:** 1

<div class="post-metadata">

### Author: ![pfaffman](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/pfaffman/32/120154_2.png) [@pfaffman](https://meta.discourse.org/u/pfaffman)
#### Post date: [2025年三月31日 18:14 UTC](https://meta.discourse.org/t/trouble-with-renderinoutlet/359690/1 "2025-03-31T18:14:10Z")

</div>

我一定是在做一些非常愚蠢的事情，但我就是看不出来。我希望在这里发帖能让我看出来，这样我就可以在别人知道我有多蠢之前删除它。

“HELLO WORLD”应该会显示在主页上。我在控制台中看到了“THIS IS THE HOMEPAGE”。我知道它在运行。但它不在那里。

然后我尝试添加“Extra item”，因为我没有其他想法了。它也没有显示出来。

在我将文件重命名为 .`gjs` 之前，我确实收到了一些错误，这进一步证明它正在关注该文件并且正在做一些事情。

```javascript
import { apiInitializer } from "discourse/lib/api";

export default apiInitializer("1.8.0", (api) => {
  // see if we're on the home page
  api.onPageChange(() => {
    const router = api.container.lookup("service:router");
    const url = router?.currentURL;
    const isHomePage = url === "/";
    api.renderInOutlet("top-notices", <template>Extra item</template>);
    if (isHomePage) {
      console.log("THIS IS THE HOMEPAGE");
      api.renderInOutlet("after-header", <template>HELLO WORLD</template>);
    }
  });
});

```

---

<div class="post-metadata">

### Author: ![merefield](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/merefield/32/176214_2.png) [@merefield](https://meta.discourse.org/u/merefield)
#### Post date: [2025年三月31日 18:17 UTC](https://meta.discourse.org/t/trouble-with-renderinoutlet/359690/2 "2025-03-31T18:17:03Z")

</div>

是否可能尚未渲染 outlet，因此没有可以附加到的 outlet？

onPageChange 在路由更改时触发……

---

<div class="post-metadata">

### Author: ![pfaffman](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/pfaffman/32/120154_2.png) [@pfaffman](https://meta.discourse.org/u/pfaffman)
#### Post date: [2025年三月31日 18:19 UTC](https://meta.discourse.org/t/trouble-with-renderinoutlet/359690/3 "2025-03-31T18:19:49Z")

</div>

听起来就像我说的那种愚蠢的事情！！

我只希望这只在首页发生。

但是是的！如果我把那些渲染的小东西从 onPageChange 中移出来，它就会渲染。

那么我如何只在 URL 是 / 时让它发生？

也许我可以做一个真正的组件，然后调用 shouldRender()？

---

<div class="post-metadata">

### Author: ![merefield](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/merefield/32/176214_2.png) [@merefield](https://meta.discourse.org/u/merefield)
#### Post date: [2025年三月31日 18:22 UTC](https://meta.discourse.org/t/trouble-with-renderinoutlet/359690/4 "2025-03-31T18:22:00Z")

</div>

你应该在组件内添加路由服务，并设置一个getter。

---

<div class="post-metadata">

### Author: ![pfaffman](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/pfaffman/32/120154_2.png) [@pfaffman](https://meta.discourse.org/u/pfaffman)
#### Post date: [2025年三月31日 18:22 UTC](https://meta.discourse.org/t/trouble-with-renderinoutlet/359690/5 "2025-03-31T18:22:37Z")

</div>

非常感谢！我大致都知道那些词的意思！

---

<div class="post-metadata">

### Author: ![merefield](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/merefield/32/176214_2.png) [@merefield](https://meta.discourse.org/u/merefield)
#### Post date: [2025年三月31日 18:23 UTC](https://meta.discourse.org/t/trouble-with-renderinoutlet/359690/6 "2025-03-31T18:23:06Z")

</div>

希望这对您有帮助！请在一切运行正常后予以确认！

---

<div class="post-metadata">

### Author: ![pfaffman](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/pfaffman/32/120154_2.png) [@pfaffman](https://meta.discourse.org/u/pfaffman)
#### Post date: [2025年三月31日 19:07 UTC](https://meta.discourse.org/t/trouble-with-renderinoutlet/359690/7 "2025-03-31T19:07:30Z")

</div>

哦，宝贝！我真的知道什么是服务！我真的知道什么是 getter！现在我的文本呈现在主页上，而不是在另一个页面上（而且可能还有其他所有页面！）。

---

<div class="post-metadata">

### Author: ![pfaffman](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/pfaffman/32/120154_2.png) [@pfaffman](https://meta.discourse.org/u/pfaffman)
#### Post date: [2025年四月30日 19:07 UTC](https://meta.discourse.org/t/trouble-with-renderinoutlet/359690/8 "2025-04-30T19:07:53Z")

</div>

此话题在最后回复后30天自动关闭。不再允许新回复。
