1、 对象:

<h1 v-for="(item,index) in userInfo" :key="index">{{item}}</h1>

data() {
      return {
              userInfo: {
                id:"1",
                name:"lucy"
              },
     }
}

页面展示效果:

1
lzz

追加数据:

this.$set(this.userInfo,"age","16");

追加之后的页面展示效果:

1
lzz
16

2、数组:

<h1 v-for="item in userInfo" :key="item.id">{{item.name}}</h1>

data() {
      return {
           userInfo: [{
                id:"1",
                name:"lucy"
              },
              {
                id:"2",
                name:"lily"
              },
              {
                id:"3",
                name:"tom"
              }
           ]
     }
}

页面展示效果:

lucy
lily
tom

追加数据:

let newObj={id:"3",name:"sam"};
this.$set(this.userInfo,3,newObj);

追加之后的页面展示效果:

lucy
lily
tom
sam

 

 
Logo

前往低代码交流专区

更多推荐