вя-JS. часы не работают при изменении данных - PullRequest
Новая
       34

вя-JS. часы не работают при изменении данных

0 голосов
/ 12 июня 2019

Я новичок в vue.js. Но у меня проблемы с привязкой данных и повторным рендерингом. Объединяя socket-io и vue-chartjsm, я столкнулся с проблемой рендеринга.

Я намеревался изменить данные через generateData(), который, казалось, работал. И я ожидал, что watch: сработает, но это не сработало.

Я думаю, что неправильно понимаю некоторые концепции. Не могли бы вы дать мне знать, что не так с моей идеей?

App.vue 

(...)
export default {
  name: "App",
  components: {
    ReactiveBarChart
  },
  data() {
    return {
      chartData: null,
      originalData: null
    };
  },
  watch: {
    originalData: function(data) {
      console.log(data)
      // not triggered after generateData() is called
    }
  },
  methods: {
    generateData() {
      let changeArray = [];
      changeArray = this.originalData;
      changeArray[0] = 20;
      this.originalData = changeArray;
      console.log("data :", this.originalData)
      // logged properly with [20, .....]
    },
(...)

1 Ответ

1 голос
/ 12 июня 2019

Попробуйте объявить originalData как пустой массив и push() свои значения в пустой массив.Ваш код может выглядеть примерно так: 

export default {
  data() {
    return {
      chartData: null,
      originalData: []
    };
  },
  watch: {
    originalData: function(data) {
      console.log(data)
    }
  },
  methods: {
    generateData() {
      let changeArray = [];
      changeArray = this.originalData;
      changeArray.push(20);
      this.originalData = changeArray;
      console.log("data :", this.originalData)
    }
  }
}

Если вы конкретно хотите изменить значение массива в первой позиции, используйте splice(0,1,20) вместо push(20)

. Вы можете прочитать более полезную информациюо Методы массива

...