Vue中使用for循環遍歷表格

<div id="app">
            <table>
                <thead>
                    <tr>
                        <th>序號</th>
                        <th>姓名</th>
                        <th>性別</th>
                        <th>年齡</th>
                    </tr>
                </thead>
                <tbody>
                    <tr v-for="(user,index) in user">
                        <td v-text="index+1"></td>
                        <td v-text="user.name"></td>
                        <td v-text="user.gender"></td>
                        <td v-text="user.age"></td>
                    </tr>
                </tbody>
            </table>
        </div>
        
        <script>
            var app=new Vue({
                el:"#app",
                data:{
                    user:[
                        {name:"楊過",gender:"男",age:"30"},
                        {name:"小龍女",gender:"女",age:"35"},
                        {name:"郭靖",gender:"男",age:"36"},
                        {name:"黃蓉",gender:"女",age:"36"},
                        {name:"郭襄",gender:"女",age:"18"},
                    ]
                }
            })
        </script>

 

<td v-text="user.age"></td>

這種寫法也可以直接換成：<td>{{user.age}}</td>

結果：