前端给数组里对象的每个元素赋一个新的元素

纳兰子玉

已于 2023-02-24 14:27:56 修改

阅读量397

点赞数

文章标签：前端 javascript vue.js

于 2023-02-24 13:54:51 首次发布

本文链接：https://blog.youkuaiyun.com/qq_59710846/article/details/129199328

版权

在Vue.js应用中，通过点击按钮触发方法，对从API获取的数据数组进行遍历，使用for循环和if判断给每个对象添加年龄标识。示例代码展示了如何操作数据并更新视图。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

我们通过请求API获取数据，需要对数组里的每个对象做出判断，这时候我们可以用for循环+if判断从而往数组里的每个对象添加一个标识

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title></title>
        <!-- <script src="https://unpkg.com/vue@next"></script> -->
        <script src="js/v2.6.10/vue.js" type="text/javascript" charset="utf-8"></script>
    </head>
    <body>
        <div id="app">
            <button type="button" class="mui-btn mui-btn-blue" @click="btn">按钮</button>
        </div>
        <script type="text/javascript">
            var app = new Vue({
                el:"#app",
                data:{
                    list:[{
                        name:'仓木麻衣',
                        sex:'女'
                    }]
                },
                methods: {
                    btn(){
                        for(let i = 0; i<this.list.length; i++){
                            console.log("打印",this.list[i])
                            this.list[i].age = 36
                            // console.log("打印2",this.list[i])
                        }
                    }
                },
            })
        </script>
    </body>
</html>

打印结果