VUE怎样同时循环两个数组呢?

现在只能显示子组件的name 我想把父组件的arr2数组的数据也同时循环出来 放到name后面 就是zhangsan对应43 lisi对应55这样 这个应该怎样才能让这两个数组同时循环出来呢?这个父子组件结构不能改变 谢谢

<!DOCTYPE html>
<html>
<head>
   <title></title>
   <script src="vue.js"></script>
   <script type="text/javascript">
      window.onload=function(){
         var contents={
             template:'#contents',
             props:['age'],
             data(){
                  return {
                     arr:[
                        {name:'zhangsan'},
                        {name:'lisi'},
                        {name:'wangwu'},
                     ]
                  }
             },
         }
         new Vue({
               el:'#div1',
               data:{
                arr2:[43,55,20],
               },
               components:{
                  'contents':contents
               },
               
         })
      }
   </script>
</head>
<body>
<template id="contents">
   <div>
        <ul>
          <li v-for="(item,index) in arr">{{item.name}}{{把arr2的数据放到这里 可以做到吗}}</li>
        </ul>
   </div>
</template>

<div id="div1">
    <contents :age="arr2"></contents>
</div>
</body>
</html>

回答:

      <li v-for="(item,index) in arr">{{item.name}}{{age[index]}}</li>

暂无评论

发表评论

您的电子邮箱地址不会被公开。 必填项已用*标注