計算されたプロパティの他のファイル

Question

Vue.jsの使用外部ファイル変数に基づいている場合、計算されたプロパティは正しく動作しますか？だから、例えば：

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

change場合

var variab = 0 

change = function(){ 
    variab = 1 
} 

return default {variab} 

をvars.jsが呼び出され、そしてvars.varはvars.jsファイルに変更され、それはまた、booleanoに影響を与えるのだろうか？

この例を実行する正しい方法は何ですか？

Answer 1

変数をVueによって反応変数に変換する必要があります。 Vueインスタンスのイニシャライザdataとしてオブジェクトを使用すると、これを行うことができます。

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>