美文网首页web前端
Vue全局变量的实现方式

Vue全局变量的实现方式

作者: 程序员不务正业 | 来源:发表于2018-08-04 22:47 被阅读98次

    创建js文件,添加需要使用的全局变量

    export default {
      tabBarItemSelected: '事业',
      newsBarSelected: '1',
      setnewsBarSelected (newsBar) {
        this.newsBarSelected = newsBar
      },
      settabBarItemSelected (item) {
          this.tabBarItemSelected = item
      }
    }
    

    1、全局变量模块导入方式

    <script>
      import config from '../config.js'
        export default {
            name: "Detail",
            created() {
                console.log(config.tabBarItemSelected)
            },
        }
    </script>
    

    2、全局变量挂载到Vue.ptototype中

    //main.js中挂载到Vue.ptototype中
    import defines from "./config";
    Vue.prototype.defines = defines;
    
    //使用
    <script>
        export default {
            name: "Detail",
            created() {
                console.log(this.defines.tabBarItemSelected)
            },
        }
    </script>
    

    相关文章

      网友评论

        本文标题:Vue全局变量的实现方式

        本文链接:https://www.haomeiwen.com/subject/wvruvftx.html