Shulou(Shulou.com)06/03 Report--

Vuejs how to globally customize variables, in view of this question, this article introduces the corresponding analysis and solution in detail, hoping to help more partners who want to solve this problem to find a more simple and easy way.

Method: set a special global variable module file, define the initial state of some variables in the module, expose it with "export default", use "Vue.prototype" in "main.js" to mount to the vue instance or use it elsewhere, you can introduce this module.

The operating environment of this tutorial: windows7 system, vue2.9.6 version, DELL G3 computer.

Define the principle of global variables:

Set up a dedicated global variable module file, define the initial state of some variables in the module, expose it with export default, mount it to the vue instance using Vue.prototype in main.js or use it elsewhere, you can introduce this module.

Global variable module file:

Global.vue file:

Const serverSrc='www.baidu.com';const token='12345678';const hasEnter=false;const userSite= "Diaoyu Islands of China"; export default {userSite,// user address token,// user token identity serverSrc,// server address hasEnter,// user login status} usage 1:

Reference to the global variable module file where needed, and then get the global variable parameter values through the variable name in the file.

Use in the text1.vue component:

{{token}} import global_ from'.. / components/Global'// reference module enters export default {name: 'text',data () {return {token:global_.token,// to assign global variables to data, or you can directly use global_.token}} mode 2:

In the main.js file at the program entry, mount the above Global.vue file to Vue.prototype.

Import global_ from'. / components/Global'// reference file Vue.prototype.GLOBAL = global_// is mounted to the Vue instance

Then the global variables defined in the Global file can be accessed directly through this instead of referencing the Global.vue module file throughout the project.

Text2.vue:

{{token}} export default {name: 'text',data () {return {token:this.GLOBAL.token,// accesses global variables directly through this. } Vuex can also set global variables. This is the answer to the question about how to customize variables globally in vuejs. I hope the above content can be of some help to you. If you still have a lot of doubts to be solved, you can follow the industry information channel for more related knowledge.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.