vue.js - 列表渲染格式有误？？？

问题描述

问 题

       <ul>
            <li v-for="test in tests">
                {{test.name}}
                <select >
                    <option v-for="te in test">{{te.op}}</option>
                </select>
            </li>
        </ul>

 data(){
        
        return {
            tests:[
                [{name:'技术',op:12},{name:'技术',op:23}],
                [{name:'前端',op:45},{name:'前端',op:85}]
            ]
        }
    },

为什么test.name没有显示数据，select能正常显示下拉数据，
老铁们，帮忙看看>_<

PS：感谢各位老铁，长知识了~_~

解决方案

你的test是个数组，哪里来的name 属性
我相你要的数据格式应该这样

[
    {
       name: '技术',
       op: [12,23]
    },
    {
       name: '前端',
       op: [12,23]
    }
]



<ul>
        <li v-for="test in tests">
            {{test.name}}
            <select >
                <option v-for="te in test.op">{{te}}</option>
            </select>
        </li>
    </ul>

这篇关于vue.js - 列表渲染格式有误？？？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！