data数据为sex的value为1或0，呈现的时候显示为“男”或“女”

最新推荐文章于 2023-09-14 16:42:24 发布

dongsdh

最新推荐文章于 2023-09-14 16:42:24 发布

阅读量9k

点赞数 1

分类专栏： Vue

本文链接：https://blog.csdn.net/dongsdh/article/details/79866476

版权

Vue 专栏收录该内容

23 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <script src="js/vue.js"></script>
    <title></title>
</head>
<body>

<div id="container">

    <table>
        <thead>
        <tr>
            <th>姓名</th>
            <th>性别</th>
            <th>年龄</th>
        </tr>
        </thead>
        <tbody>
            <tr v-for="tmp in stuList">
                <!--<td v-for="value in tmp">-->
                    <!--{{value}}-->
                <!--</td>-->
                <td>{{tmp.name}}</td>
                <!--<td>{{tmp.sex}}</td>-->
                <td>{{tmp.sex>0?'男':'女'}}</td>
                <td>{{tmp.age}}</td>
            </tr>
        </tbody>
    </table>

</div>

<script>
    new Vue({
        el:'#container',
        data:{
            stuList:[
                {name:'michael',sex:1,age:20},
                {name:'miller',sex:1,age:21},
                {name:'lincoln',sex:0,age:23},
                {name:'lucy',sex:1,age:22},
                {name:'hanmeimei',sex:0,age:19}
            ]
        }
    })
</script>


</body>
</html>