vue直接添加属性是否响应式

 根据官方文档定义：如果在实例创建之后添加新的属性到实例上，它不会触发视图更新。

 
<script>
export default {
    name: "isXYSList",
    data() {
        return {
            peopleList: [
                {
                    id: 1,
                    name: "小明",
                },
                {
                    id: 2,
                    name: "小蓝",
                },
                {
                    id: 3,
                    name: "小红",
                },
            ],
        };
    },
    methods: {
        //添加新属性 测试是否响应式
        addNewPrototype() {
            this.peopleList.forEach(item => {
                // item.age = 16; //非响应式
                this.$set(item, "age", 16); //响应式
            });
            console.log(this.peopleList, "1");
        },
        changeAge(item) {
            item.age = 15;
            console.log(this.peopleList, "2");
        },
    },
};
script>
 
<style lang="less" scoped>style>