responseは[{prop1: {}, prop2: {}},
{prop1: {}, prop2: {}}] とする
messages ではこのresponse をすべて格納して modifiedMessages ではprop2を削除して格納したい。
@messages.vue 親コンポーネント
<app-messages v-for="message in messages"
m=message
key=message.id >
mounted() {
axios.get('getMessages').then(response => {
this.messages = response.data;
const target = response.data;
for(var i =0; i < target.length; i++) {
delete target[i].prop2;
}
this.modifiedMessages = target;
})
@message.vue 子コンポーネント
{{ m.prop2 }} エラー
>>> this.messages, this.modifiedMessages ともにprop2が消滅している。
mounted() {
axios.get('getMessages').then(response => {
this.messages = response.data;
return response.data;
}).then(response => {
const target = response;
for(var i =0; i < target.length; i++) {
delete target[i].prop2;
}
this.modifiedMessages = target;
});
@message.vue 子コンポーネント
{{ m.prop2 }} OK
>>> this.messages, this.modifiedMessages ともにprop2が消滅している。
したがって vue debugger 上では m のprop2 は表示されていない。にもかかわらずちゃんとprop2 が子コンポーネントにパスされ、正常に{{ m.prop2 }} が動作している原因は不明。
