1

我想为我的视图创建抽象组件,这些组件不会透露它们的呈现方式。该示例是一个选项卡式导航框,类似于引导程序中的选项卡

在我看来,我想写s.th。喜欢:

    = tab_section(self) do
      - tab 'tab1' do
        %p tab1 content
        = link_to example_var, "#top"
      - tab 'tab2' do
        %p tab2 content
        = link_to 'http://example.com', "#top"

然后应该将其呈现给s.th。像这样:

        <ul>
          <li>tab1</li>
          <li>tab2</li>
        </ul>
        <div class='content'>
          <div class='tab'>
            <p>tab1 content</p>
            <a href='#top'>this could also be an @var from the controller</a>
          </div>
          <div class='tab'>
            <p>tab2 content</p>
            <a href='#top'>http://example.com</a>
          </div>
        </div>

我所有推迟呈现选项卡“内容”的尝试都失败了。我创建了一个最小的 Rails 应用程序来展示我采用的三种方法。

查看 application_helper.rb 和 welcome#show 视图。做这种事情的正确方法是什么?

4

1 回答 1

1

我得到了一些支持,并找到了以下解决方案:

必须将外部“组件”传递到块中才能调用内部函数:

      = tab_section2 do |section|
        - section.tab 'tab1' do
          %p tab1 content
          = link_to example_var, "#top"
        - section.tab 'tab2' do
          %p tab2 content
          = link_to 'http://example.com', "#top"

由于我们不需要将块绑定到 tab_section 实例(之前使用 instance_exec 完成),我们可以直接生成块。

      def tab_section2(&blk)
        raise "Y U NO SUPPLY block?" unless block_given?
        ts = TabSection2.new(self, self)
        yield(ts)
        render :partial => '/tab2', locals: {section: ts}
      end

部分渲染选项卡渲染函数的输出:

    %ul
      - section.tabs.each do |tab|
        %li= tab.name
    .content
      - section.tabs.each do |tab|
        .tab
          = tab.render.html_safe

其实现如下:

    class Tab2

      attr_reader :name, :blk
      def initialize(name, context, &blk)
        @context = context
        @name = name
        @blk = blk 
      end 

      def render
        @context.capture_haml(&@blk)
      end 
    end 

    class TabSection2
      attr_reader :tabs

      def initialize(context)
        @context = context
        @tabs = []
      end 

      def tab(name, &blk)
        raise "Y U NO SUPPLY block?" unless block_given?
        @tabs << Tab2.new(name, @context, &blk)
      end 
    end 
于 2012-06-13T12:29:28.240 回答