Другой файл вычисляемого свойства

Использование Vue.js. Будет ли вычисленное свойство работать правильно, если оно основано на внешней файловой переменной? Так например:

import vars from "./vars.js
return default {
    computed: {
        booleano : function() {
            if (vars.variab == 0){
                return true
            }
            return false
        }
    }
}

vars.js

var variab = 0

change = function(){
    variab = 1
}

return default {variab}

Если вызывается change и изменяется vars.var в файле vars.js, повлияет ли это также на логическое значение?

Если нет, то как правильно сделать этот пример?


vue.js computed-properties
person Louis Vetter    schedule 28.11.2017    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Вам нужно, чтобы переменная была преобразована Vue в реактивную переменную. Вы можете сделать это, используя объект как data инициализатор вашего экземпляра Vue.

const vars = {
  variab: 0
};

new Vue({
  el: '#app',
  data() {
    return {
      vars
    };
  },
  computed: {
    booleano() {
      if (this.vars.variab == 0) {
        return true;
      }
      return false;
    }
  }
});

setTimeout(() => {
  vars.variab = 1;
}, 1000);
<script src="//cdnjs.cloudflare.com/ajax/libs/vue/2.4.2/vue.min.js"></script>
<div id="app">
  <div v-if="booleano">Yes</div>
  <div v-else>No</div>
</div>

person Roy J    schedule 28.11.2017