如何在scala中显示树导航菜单？答案

【问题标题】：How to show tree navigation menu in scala?如何在scala中显示树导航菜单？
【发布时间】：2013-12-21 05:57:58
【问题描述】：

我是 scala 的新手。我正在尝试构建类似的导航树

父母
- 孩子1
- 孩子2
- 孩子3
- 孩子4

我有一个模型类。

case class Field(id:Long, name:String, icon:String, parentid:Long)

object Field {
  def all():List[Field] = {
    List(
      Field(1,"Parent1","1", 0),
      Field(2,"Child1","2",1),
      Field(3,"Child2","3",1),
      Field(4,"Child3","4",1),
      Field(5,"Child4","5",1)
    )
  }
}

在我看来，我有一个渲染代码：

@fields.groupBy(_.parentid).map {  case ( parentid, tasks) =>
<ul>
    <li>@parentid</li>
    <ul>
        @tasks.map { task =>
            <li>@task.name</li>
        }
    </ul>
</ul>
}

但不幸的是输出是：

1
- 孩子1
- 孩子2
- 孩子3
- 孩子4
0
- 父母1

如何建立导航菜单，模型有子/父关系？我希望你能理解我的问题，并会帮助我。对不起我的英语不好

【问题讨论】：

标签： scala playframework tree playframework-2.0 playframework-2.2

【解决方案1】：

将您拥有的结构转换为树会非常棘手。您需要定义另一种类型来表示树节点，并且您需要一个递归函数来处理您的Field 列表。

我建议改用以下结构：

case class TreeNode(name: String, icon: String, children: TreeNode*)

object Menu {
  val tree = TreeNode("parent", "0",
    TreeNode("child1", "1"),
    TreeNode("child2", "2"),
    TreeNode("child3", "3",
      TreeNode("grandchild1", "4"))
   )
}

您将需要一个递归函数（模板中的“代码块”）来呈现它：

@renderNode(n: TreeNode) = {
  <li>@n.name</li>
  @if(!n.children.isEmpty) {
    <ul>
      @for(c <- n.children) {
        @renderNode(c)
      }
    </ul>
  }
}

<ul>
   @renderNode(Menu.tree)
</ul>

我没有在 Play 模板中尝试过递归代码块，所以我不知道这是否可行！

【讨论】：