私は自分のウェブサイトのページをデータベースに保存しています。 Laravelを使用して(それは私の質問にとっては本当に重要ではありませんが)、私はサイトの階層を出力し、以下を参照することができます。 (私は、データベースの構造を変更し、必要に応じて複数の列を追加するための柔軟性を持っている)データベースからネストされたナビゲーションメニューを生成する方法
[
{
"ref_id": "1",
"parent_id": "0",
"name": "Item 1",
"child_count": 0
},
{
"ref_id": "2",
"parent_id": "0",
"name": "Item 2",
"child_count": 2
},
{
"ref_id": "3",
"parent_id": "2",
"name": "Item 2 Sub 1",
"child_count": 0
},
{
"ref_id": "4",
"parent_id": "2",
"name": "Item 2 Sub 2",
"child_count": 0
},
{
"ref_id": "5",
"parent_id": "0",
"name": "Item 3",
"child_count": 2
},
{
"ref_id": "6",
"parent_id": "5",
"name": "Item 3 Sub 1",
"child_count": 0
},
{
"ref_id": "7",
"parent_id": "5",
"name": "Item 3 Sub 2",
"child_count": 0
},
{
"ref_id": "12",
"parent_id": "0",
"name": "Item 4",
"child_count": 0
},
{
"ref_id": "13",
"parent_id": "0",
"name": "Item 5",
"child_count": 3
},
{
"ref_id": "14",
"parent_id": "13",
"name": "Item 5 Sub 1",
"child_count": 0
},
{
"ref_id": "15",
"parent_id": "13",
"name": "Item 5 Sub 2",
"child_count": 2
},
{
"ref_id": "16",
"parent_id": "15",
"name": "Item 5 Sub 2 SubSub 1",
"child_count": 0
},
{
"ref_id": "17",
"parent_id": "15",
"name": "Item 5 Sub 2 SubSub 2",
"child_count": 0
},
{
"ref_id": "18",
"parent_id": "13",
"name": "Item 5 Sub 3",
"child_count": 0
},
{
"ref_id": "19",
"parent_id": "0",
"name": "Item 6",
"child_count": 0
}
]
私は、これらのノードと出力を通じて次のようになり、ネストされたULナビゲーションを反復処理する必要があります。 ULは、コードが動的でなければならないように、いくつかの層を深くネストすることができます。
<ul>
<li>Item 1</li>
<li>Item 2
<ul>
<li>Item 2 Sub 1</li>
<li>Item 2 Sub 2</li>
</ul>
</li>
<li>Item 3
<ul>
<li>Item 3 Sub 1</li>
<li>Item 3 Sub 2</li>
</ul>
</li>
<li>Item 4</li>
<li>Item 5
<ul>
<li>Item 5 Sub 1</li>
<li>Item 5 Sub 2
<ul>
<li>Item 5 Sub 2 SubSub 1</li>
<li>Item 5 Sub 2 SubSub 2</li>
</ul>
</li>
<li>Item 5 Sub 3</li>
</ul>
</li>
<li>Item 6</li>
</ul>
私がこれまで行ってきたことは、かなり近いです。これは現時点で得られるほど良いものです。これはLaravelのブレード構文ですが、これは私が後にしているロジックですので、これもvanilla PHPにも当てはまります。
<ul>
@php
$child_count = 0;
$total_children = 0;
@endphp
@foreach($q_list as $row)
@if($total_children)
@php $child_count++; @endphp
@endif
<li>{{ $row->name }}
@if($row->child_count)
@php
$total_children = $row->child_count;
$child_count = 0;
@endphp
<ul>
@elseif($total_children == $child_count && $total_children != 0)
@php
$total_children = 0;
$child_count = 0;
@endphp
</ul>
@endif
@if($total_children == $child_count || $row->child_count == 0)
</li>
@endif
@endforeach
</ul>
これは、その結果:
<ul>
<li>Item 1</li>
<li>Item 2
<ul>
<li>Item 2 Sub 1</li>
<li>Item 2 Sub 2
</ul>
</li>
<li>Item 3
<ul>
<li>Item 3 Sub 1</li>
<li>Item 3 Sub 2
</ul>
</li>
<li>Item 4</li>
<li>Item 5
<ul>
<li>Item 5 Sub 1</li>
<li>Item 5 Sub 2
<ul>
<li>Item 5 Sub 2 SubSub 1</li>
<li>Item 5 Sub 2 SubSub 2
</ul>
</li>
<li>Item 5 Sub 3</li>
<li>Item 6</li>
</ol>
私はスクリプトは非常に厄介であると思いますが、もっと重要なのは、二つの問題がここにあります。まず、ネストされた各ULの最後の項目には、</li>
が省略されています。第2に、各ネストされた<ul>
は1回だけ閉じられます。ネストされた<ul>
がレベル2にしか存在しないが、より大きい(アイテム5サブ2サブサブ*のような)大きいアイテムが閉じて<li></ul>
タグを持たない場合、アイテム6が間違ったレベルになる。 (つまり、商品5の子です)
誰でも空白を記入するか、これを達成するためのよりよい方法を教えてください。ありがとう
でヘルパー
を作成します。 – Phiter