изменение данных weex для обновления до дочернего компонента - PullRequest
0 голосов
/ 28 октября 2018
<template>
    <topView viewInfo="cardInfo"></topView>
    <bottomView viewInfo="cardInfo"></bottomView>
<template>
<script>
     module.exports = {
        data: {
          viewInfo:{
             attr0:value0,
             attr1:value1
          }
       },
       mounted:function(){
          getDataFromServer();
       },
       methods:{
          getDataFromServer:function(){
            var me = this;
            var httpRequest = Service.getViewInfo();
            httpRequest.on("success",function(data){
               me.viewInfo.attr2 = data.info.attr2;
               me.viewInfo.attr3 = data.info.attr3;
               me.viewInfo.attr4 = data.info.attr4;

           });
           httpRequest.send();
      }
    }
  }
</script>

topView.vue

<template>
<div>
  <text>{viewInfo.attr0}</text>
  <div v-for="(item, index) in getItems">
        <text>{item.text}</text>
        <text>{item.info}</text>
  </div>
  <text>{viewInfo.attr1}</text>
</div>
<template>

<script>
 module.exports = {
    data: {
      itemInfo:[
          {text:'text 0',info:"****"},
          {text:'text 1',info:"****"},
          {text:'text 2',info:"****"}
      ]
    },
    props:{
        viewInfo:{}
    },
    computed:{
      getItems:function(){
        this.itemInfo[0].info = this.viewInfo.attr2 +" point";
        this.itemInfo[1].info = this.viewInfo.attr3 +" point";
        this.itemInfo[2].info = this.viewInfo.attr4 +" point";

        return itemInfo;
      }
    },
    methods:{

       }
    }
</script>

когда я получаю данные с сервера и добавляю некоторое значение attr в viewInfo.дочерний компонент может обновлять прямое значение. вычислительные значения не могут обновлять отношение к реквизитам данных из родительского компонента.

нужна помощь. как я могу обновить значение элементов вычислений, когда я обновляю значения родительского компонента "viewInfo".

1 Ответ

0 голосов
/ 28 октября 2018

Vue не может обнаружить изменения, когда вы непосредственно устанавливаете элемент с индексом , то есть this.itemInfo[0].info = this.viewInfo.attr2 +" point" Не реагирует .

Вместо этого используйте Vue.set,для вышеупомянутого:

// create a new item
var newItem = Object.assign({}, this.itemInfo[0], { info: this.viewInfo.attr2 +" point" })
// set the new item to the specific index
this.$set(this.itemInfo, 0, newItem)

Подробнее о предостережениях при просмотре списка можно прочитать здесь :

...