ECL 可扩展组件

npm 软件包 : @ecl/expandable

npm install --save @ecl/expandable

参数:

• 编号 (字符串)(默认:随机) 无障碍约束的独特代号
• "已扩展" (字符串)(默认:") 内容被扩展时的按钮标签
• 标签已粘合 (字符串)(默认:") 内容崩溃时的按钮标签
• "按钮" (对象)按钮属性,遵循ECL按钮结构
• "外从下到下"类 (字符串)(默认为:")可扩展内容面板的额外类
• "超级" (字符串)(默认为:") 额外类(空格分隔)
• “外部属性” (阵列) (默认: []) 额外属性
  • 名称 (字符串) 属性名称, 如“ 数据测试 ”
  • 值 (字符串) 属性值, 如 : “ data- test-1 ”

块 :

• "内容"

示例

{% include '@ecl/expandable/expandable.html.twig' with { 
  id: 'expandable-example', 
  button: { 
    label: 'Collapsed button', 
  }, 
  label_expanded: 'Expanded button', 
  label_collapsed: 'Collapsed button', 
  content: 
    '<p class="ecl-u-type-paragraph-m">The EU is building an energy union that ensures Europe’s energy supply is safe, viable and accessible to all. In doing so, it can boost the economy and attract investments that can create new jobs opportunities.</p>', 
} %}