您当前的位置： 首页 > 慢生活 > 程序人生 网站首页程序人生

02vue 目录结构分析 数据绑定 绑定属性 循环渲染数据 数据渲染02

发布时间：2023-04-03 18:14:25编辑：雪饮阅读（）

循环嵌套
script
<script>
    export default {    
      data () {  /*业务逻辑里面定义的数据*/
        return {
          list2:[
              {
                "cate":"国内新闻",
                "list":[
 
                   {'title':'国内新闻11111'},
                   {'title':'国内新闻2222'}
                ]
              },
              {
                "cate":"国际新闻",
                "list":[
 
                   {'title':'国际新闻333'},
                   {'title':'国际新闻444'}
                ]
              }
 
          ]
 
        }
      }
    }
</script>
template
    <ul>
      <li v-for="item in list2">
          <div>
            <p>分类:{{item.cate}}</p>
            <ul>
              <li style="text-indent: 10px;" v-for="item2 in item.list" >{{item2.title}}</li>
            </ul>
           
          </div>
      </li>
    </ul>