是否有方法仅在移动设备上启用某个组件？

[hipp0]

我希望在移动设备上启用右下角的新主题按钮，使其类似于 X.com New Topic Header Button

但在桌面上不启用。

[RGJ (Richard - Communiteq)]

Discourse 正在摒弃传统的桌面/移动设备区分。请参阅 https://meta.discourse.org/t/designing-for-different-devices-viewport-size-touch-hover-etc/367810，其中也包含有关如何实现您所需功能的提示。

[hipp0]

我明白了，谢谢你的信息。

但是，我如何才能让一个组件只在较小的设备上渲染呢？

我不太确定如何引用一个组件或为其启用其中一个。

[RGJ (Richard - Communiteq)]

示例就在那个主题中

@system

import Component from "@glimmer/component";
import { service } from "@ember/service";

class MyComponent extends Component {
  @service capabilities;

  <template>
    {{#if this.capabilities.viewport.lg}}
      此文本将显示在大于 lg 断点的设备上
    {{/if}}

    {{#unless this.capabilities.viewport.sm}}
      此文本将显示在小于 sm 断点的设备上
    {{/unless}}
  </template>
}