vue v-if指令可以通过全局变量来判断显示隐藏么

Question

这是header组件 我是想通过一个全局变量来控制他的显示隐藏 每当离开一个组件的时候 这个导航就关闭

methods是这么写的 但是如果v-if="global.xxx" 就会报错 因为项目就这一个需要保存状态的地方 所以就不想用vuex来控制 小弟新手 想了半天没想到怎么做 还请大家指点

Answer 1

试试
// bus.js

var Vue from 'vue'
var bus = new Vue({
  data: {
    close: true
  }
})
bus.$on('close', function () {
  bus.close = !bus.close
})
export default bus

// router

import bus from 'bus'
var router = new Router(xxx)
router.afterEach((to, from) => { // 也可用beforeEach 路由变化触发close事件。
  bus.$emit('close')
})
export default router

然后用到的地方。你的头组件

import bus from 'bus'
computed () {
  close () {
    return bus.close
  }
}

以bus实例为枢纽，做数据的响应与传输。
其实这就是个超简单的vuex。

向你之前的global.xxx =!global.xxx这种传递方式应该是不能被vue监测到的。

Answer 2

将global换成window;
然后在computed里面绑定showNav
btw,为什么不用vuex呢？

Answer 3

浏览器环境下没有global

Answer 4

可以，在app.js里定义

Vue.prototype.$test=false

v-if="$test"