在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問答/HTML/ vue更新對象里面的數(shù)組后如何能夠?qū)崟r渲染出數(shù)據(jù)？

vue更新對象里面的數(shù)組后如何能夠?qū)崟r渲染出數(shù)據(jù)？

如：

<div v-for="(user,userIndex) in users" :key="userIndex">
    <div>
        <span>{{user.name}}</span>
        <div v-for="(friend,friendIndex) in user.friends" :key="friendIndex">    
            {{friend.name}}
        </div>
    </div>
</div>
...
data(){
  return{
        users:[{
            name:'zhangwei',
            age:'18',
            friends:[{
                name:'wangwang',
                age:19
            }]
        }]
  }
},
...

好，上面代碼都沒有問題，那么現(xiàn)在我有個方法是更新users里面的friends數(shù)據(jù)，如下：

...
methods:{
    updateFriends(){
        let newFriends = [{
            name:'lilei',
            age:20
        },{
            name:'hanmeimemi',
            name:18
        }];
        
        this.users.forEach(user=>{
            user.friends = newFriends;//但是我這樣賦值并沒有更新渲染，這是 怎么回事？如何修改？
        })
    }
}
...
回答
編輯回答
我以為

你這個應(yīng)該沒問題啊
操作的不是數(shù)組下標，是數(shù)組里的對象應(yīng)該可以更新
我試了一下也可以

2017年11月23日 08:46
編輯回答
毀憶

如果用你這種寫法的話，官方文檔有說明，用$set。推薦直接替換數(shù)據(jù)模型里的users

2017年4月3日 23:01
編輯回答
舊言

建議排查下，是不是有增減users成員

2017年1月21日 11:46
編輯回答
北城荒

由于 JavaScript 的限制，Vue 不能檢測以下變動的數(shù)組：
1.當(dāng)你利用索引直接設(shè)置一個項時，例如：vm.items[indexOfItem] = newValue
2.當(dāng)你修改數(shù)組的長度時，例如：vm.items.length = newLength
為了解決第一類問題，以下兩種方式都可以實現(xiàn)和 vm.items[indexOfItem] = newValue 相同的效果，同時也將觸發(fā)狀態(tài)更新，例如：

Vue.set(example1.items, indexOfItem, newValue)

或者

// Array.prototype.splice
example1.items.splice(indexOfItem, 1, newValue)

解決第二類問題

example1.items.splice(newLength)
2018年4月19日 12:57
編輯回答
祉小皓
    updateFriends(){
        let newFriends = [{
            name:'lilei',
            age:20
        },{
            name:'hanmeimemi',
            name:18
        }];
        
        this.users = this.users.map(user => {
            return {...user, friends: newFriends}
        })
    }
2017年12月23日 13:02