Question

我可以通过我的vuejs应用程序中的商店创建一个常量，但我认为这不是一个好习惯。还有其他方法可以做同样的事情吗？

Answer 1

您始终可以在Vue应用范围之外定义变量，并在整个应用程序中使用它。

但是，如果您使用任何捆绑包，如Webpack / Browserify / etc.您也可以这样做，但您必须将其导入到使用它的每个组件中。一个例子可以在下面找到。

//const.js
export default {
   c1: 'Constant 1',
   c2: 'Constant 2'
}

// component.vue
import const from './const';

export default {
  methods: {
    method() {
      return const.c1;
    }
  }
}

Answer 2

您可以使用方法

const State= Object.freeze({ Active: 1, Inactive: 2 });
export default {
  data() {
    return {
      State,
      state: State.Active
    };
  },
  methods: {
    method() {
      return state==State.Active;
    }
  }
}

或

const State= Object.freeze({ Active: 1, Inactive: 2 });
export default {
  data() {
    return {
      State_: State,
      state: State.Active
    };
  },
  methods: {
    method() {
      return state==State_.Active;
    }
  }
}

Answer 3

改为尝试

//conts.js
const test = "texte";

export default test

//component.vue
import test from "./conts";

<template>
  <div>
   {{example}}
  </div>
</template>

export default {
  data: function(){
   return {
    example: test
  }
 }
}

Answer 4

最小的大解决方案

//helper.js
    
export const Test = {
  KEY1: 1,
  KEY2: 2,
  KEY3: 3,
  KEY4: 4
}

测试代码。

//page.vue
import {Test} from "./helper";

<template>
  <div>
   {{testing.KEY2}}
  </div>
</template>

export default {
  data: function(){
   return {
    testing: Test
  }
 }
}

创建常量的最佳方法是什么，可以从VueJs中的整个应用程序访问？

4 个答案: