vuejsを使用した階層テーブル

Question

私が作業しているアプリケーションにいくつかのツリー構造を表示する必要があります。

Category 1 
     - Subcategory 1.1 
       - Subcategory 1.1.1:  5 items 
       - Subcategory 1.1.2:  6 items 
     - Subcategory 1.2 
       - Subcategory 1.2.1:  2 items 
Category 2 
     - Subcategory 2.1 
       - Subcategory 2.2.1:  5 items 
       - Subcategory 2.2.2:  6 items 
       - Subcategory 2.2.3:  5 items 
       - Subcategory 2.2.4:  6 items 

だから私は、私は、親グループにROWSPANを変更する必要のあるテーブルの上にこれを配置する必要があります。サンプルデータは、このようなものになるだろう。私はVuejsでそれをどうやって行うのか分かりません。私は3つのレベルでv-for構造を試しましたが、真剣に失われています。誰もVueと似た何かをやったことはありますか？

Answer 1

CSSグリッドを使用して表を作成することを検討してください。 CSSルール（：クラス）を条件付きで漸進的にインデントすることができます。たとえば、.level__2 {margin-left：24px;}