专为 Rails 设计的前端模块化框架

用法

<%= tao_tree departments_tree_data, {
  selectable: true,
  remote: -> (department, depth) {
    { url: docs_department_tree_items_path(department[:id]) } if depth > 0
  },
  expanded: -> (department, depth) { depth < 1 }
} do |department| %>
  <div class="department-<%= department[:id] %>">
    <%= department[:name] %>
  </div>
<% end %>

<!-- remote response -->
var parentItem = $('.tao-tree-item[tao-id=<%= params[:tree_item_id] %>]').get(0)
var $treeList = $('<%= j render 'tree_list', {
  departments: @children_departments,
  depth: params[:depth].to_i + 1,
  selectable: params[:selectable].present?,
  selected: params[:selected].present?
} %>');
parentItem.updateList($treeList);

<!-- _tree_list.html.erb -->
<%= tao_tree_list departments, {
  selectable: true,
  selected: selected,
  depth: depth,
  remote: -> (department, depth) {
    { url: docs_department_tree_items_path(department[:id]) }
  }
} do |department| %>
  <div class="department-<%= department[:id] %>">
    <%= department[:name] %>
  </div>
<% end %>
行政部
行政子部门1
行政子部门2
行政子部门3
行政子部门4
人事部
人事子部门1
人事子部门2
人事子部门3
产品部
市场部
销售部
销售子部门1
销售子部门2
销售子部门3