ember.js - 如何在默认情况下保持 ember bootstrap 手风琴展开？

Question

我应该传递什么属性来保持引导手风琴打开。

<BsAccordion as |acc|>
  <acc.item @value={{1}} @title="First item">
    <p>Lorem ipsum...</p>
    <button {{on "click" (fn acc.change 2)}}>
      Next
    </button>
  </acc.item>
  <acc.item @value={{2}} @title="Second item">
    <p>Lorem ipsum...</p>
  </acc.item>
  <acc.item @value={{3}} @title="Third item">
    <p>Lorem ipsum...</p>
  </acc.item>
</BsAccordion>

Answer 1

<BsAccordion>Ember Bootstrap提供的组件有一个@selected参数。与参数匹配的AccordionItem参数将打开。@value@selected

上面给出的示例将显示标题为“ Second item ”的项目为打开状态。

<BsAccordion @selected={{2}} as |ac|>
  <acc.item @value={{1}} @title="First item">
    <p>Lorem ipsum...</p>
  </acc.item>
  <acc.item @value={{2}} @title="Second item">
    <p>Lorem ipsum...</p>
  </acc.item>
  <acc.item @value={{3}} @title="Third item">
    <p>Lorem ipsum...</p>
  </acc.item>
</BsAccordion>

请注意，这不会阻止用户更改当前打开的项目。这样做可以通过@selected在@onChange事件中重置来实现。