如何使用netzke实现每个用户的折叠？

Question

以下是要求：

在边框布局UI中，用户(职员)网格位于西侧，而当一个职员被选中时，中央的手风琴将在每个面板中显示所选用户的多个集合(例如，奖项等)。

代码：

class StaffsAndAwards < Netzke::Base
  # Remember regions collapse state and size
  include Netzke::Basepack::ItemPersistence

  def configure(c)
    super
    c.items = [
      { netzke_component: :staffs, region: :west, width: 300, split: true },
      { netzke_component: :accordion, region: :center }
    ]
  end

  js_configure do |c|
    c.layout = :border
    c.border = false

    # Overriding initComponent
    c.init_component = <<-JS
      function(){
        // calling superclass's initComponent
        this.callParent();

        // setting the 'rowclick' event
        var view = this.getComponent('staffs').getView();
        view.on('itemclick', function(view, record){
          this.selectStaff({staff_id: record.get('id')});
          this.getComponent('awards').getStore().load();
        }, this);
      }
    JS
  end

  endpoint :select_staff do |params, this|
    component_session[:selected_staff_id] = params[:staff_id]
  end

  component :staffs do |c|
    c.klass = Netzke::Basepack::Grid
    c.model = "Staff"
    c.region = :west
  end

  component :awards do |c|
    c.kclass = Netzke::Basepack::Grid
    c.model = 'Award'
    c.data_store = {auto_load: false}
    c.scope = {:staff_id => component_session[:selected_staff_id]}
    c.strong_default_attrs = {:staff_id => component_session[:selected_staff_id]}
  end

  component :accordion do |c|
    c.klass = Netzke::Basepack::Accordion
    c.region = :center
    c.prevent_header = true
    c.items = [ { :title => "A Panel" }, :awards ]    # The error may occur here. :awards cannot be found. 
  end

end

错误是"NameError (uninitialized constant Awards)“。似乎:无法找到奖励组件，尽管上面已经定义了它。

一个组件可以嵌入到另一个组件中吗？或者如何解决它？谢谢。

Answer 1

您在这里犯了一个非常常见的错误，将:awards组件声明为StaffsAndAwards的子级，而它应该是Accordion的子级。

这很容易修复。单独声明您的accordion组件(例如，我们将其命名为AwardsAndStuff)，将:awards声明移到它上面，然后在StaffAndAwards中引用它：

component :accordion do |c|
  # if you call the component :awards_and_stuff instead of :accordion, next line is not needed
  c.klass = AwardsAndStuff

  # important - pass the staff_id
  c.staff_id = component_session[:selected_staff_id]

  c.region = :center
  c.prevent_header = true
end

在AwardsAndStuff中，您可以作为config.staff_id访问staff_id，并将其传递给：config.staff_id组件：

component :awards do |c|
  c.kclass = Netzke::Basepack::Grid
  c.model = 'Award'
  c.data_store = {auto_load: false}
  c.scope = {:staff_id => config.staff_id}
  c.strong_default_attrs = {:staff_id => config.staff_id}
end

这样，您还可以独立测试AwardsAndStuff。