vueの配列には他の配列があります。それらをループアウトするにはどうすればよいですか?

何も言わずにコードを見てください

以下は私の例のモジュールで、ループアウトしたいコンテンツです

    const LOOP = [
        {
    
    
            name: 'name',
            des: 'des',
            test: [
                {
    
    
                    name: 'name1',
                    des: 'des1',
                },
            ],
        },
        
        {
    
    
            name: 'NAME',
            des: 'DES',
            test: [
                {
    
    
                    name: 'NAME2',
                    des: 'DES2',
                },
            ],
        },
    ];

結果:


     <div v-for="item in LOOP" :key="item">
       {
    
    {
    
     item.name }}
       {
    
    {
    
     item.des }}<br />
       <div v-for="item in item.test" :key="item">
         {
    
    {
    
     item.name }}<br />
         {
    
    {
    
     item.des}}
       </div>
     </div>

エフェクト画像
これはすべてループアウトされています〜

Tip: 構造が乱雑な場合がありますので、このように印刷することをお勧めします

    <div v-for="item in test" :key="item">
	    {
    
    {
    
     item.name }}
	    {
    
    {
    
     item.des }}<br />
	    {
    
    {
    
     item }}      //看看这是什么?
	    <div v-for="item in item.test" :key="item">
	        {
    
    {
    
     item.name }}<br />
	        {
    
    {
    
     item.des }}
	        {
    
    {
    
     item }}     //看看这是什么?
	    </div>
    </div>

ここに画像の説明を挿入

おすすめ

転載: blog.csdn.net/weixin_43814775/article/details/114296153