Vue. js Как наблюдать перед подключением (), не может получить данные из часов - PullRequest
0 голосов
/ 14 апреля 2020

В части async mounted() он не может извлечь данные из this.point0, потому что он смонтирован перед просмотром, верно? Как я могу это исправить.

Моя цель - обновлять p1 и p0 в mount () каждый раз, когда новый API отправляется в часы

Можете проверить мой код здесь https://jsfiddle.net/1eahf26q/

  data() {
    return {
      point0: [],
      point1: [],
    };
  },

  watch: {
   async breedKey (newVal, oldVal)  {
       try {
      this.promise = axios.get(new_url);
      const res = await this.promise;

      this.point0 = res.data.data[0].Freq;
      this.point1 = res.data.data[1].Freq;
   }
  },    

  async mounted() {
    await this.promise;

    let p0 = this.point0;
    let p1 = this.point1;
    const datapresent = [p0, p1, this.point1,];
    },
})

1 Ответ

1 голос
/ 14 апреля 2020

По вашему коду, кажется, что вычисленный сделает эту работу. Попробуйте переместить вашу логику c с mounted() на вычисленную как

computed: {
    dataPreset() {
        return [this.p1, this.p2];
    }
 }

Это автоматически вернет обновленный dataPreset при каждом изменении p1 или p2.

EDIT:

Насколько я понял, вы можете определенно инициализировать свой график, как только у вас есть данные API внутри вашего наблюдателя. Ваш наблюдатель может выглядеть как

watch: {
    selectedTrend: {
      immediate: true,
      handler(to) {
        this.trend = to.Trends;
        this.GetAPIData(to.Trends, to.DT);  //A method to get the sample API DATA
        this.InitializeGraph(); //A method which initializes your graph
      }
    }
  },

Образец песочницы, созданный по адресу: https://codesandbox.io/s/twitter-trends-fp0wn

...