EMBER：仅当组件已屈服时才渲染div块

fquxozlt 于 2023-08-04 发布在其他

关注(0)|答案(1)|浏览(151)

我有以下的HBS片段：

<div class='photo-viewer-control' local-class='leftbar'>
  {{yield to='leftbar'}}
</div>

字符串
我正在使用leftbar组件：

<Viewer>
  <:leftbar>
    <Infos
      @image={{this.currentImage}}
    />
  </:leftbar>
</Viewer>

型
我只想在leftbar已经产生的情况下呈现div。
我已经尝试了以下操作：

{{#if (has-block 'leftbar')}}
  <div class='photo-viewer-control' local-class='leftbar'>
    {{yield to='leftbar'}}
  </div>
{{/if}}

型
我添加了has-block，但是当没有leftbar时，div仍然在渲染。

ember.js

来源：https://stackoverflow.com/questions/76589339/ember-render-div-block-only-if-component-has-yielded

1条答案

按热度按时间

pbpqsu0x1#

你的代码非常接近！
为了避免呈现:leftbar，请省略以下代码块：

<Viewer>
  no left bar will be rendered
</Viewer>

字符串
这是一个demo of how this works

const Viewer = <template>
  {{yield}}

  {{#if (has-block 'leftbar')}}
    <div>
      {{yield to="leftbar"}}
    </div>
  {{/if}}
</template>;

<template>
  <Viewer>
    <:leftbar>
      leftbar content
    </:leftbar>
  </Viewer>

  <Viewer>
    no leftbar content
  </Viewer>
</template>

型
(this demo使用了新的“gjs”格式--如果不熟悉，请点击此处教程：https://tutorial.glimdown.com）

赞(0）回复(0）举报 2023-08-04

我来回答

EMBER：仅当组件已屈服时才渲染div块

1条答案

相关问题

热门标签

最新问答