父组件监听子组件的值

方法一：

目录下新建 bus.js

// eventbus传值  new 的vue实例
import Vue from 'vue'
export default new Vue()

子组件中使用方法：

<script>
import Bus from './../bus.js'
export default {
    data() {
      return {}
    },
    methods: {
        goEdit(){
            Bus.$emit('menuIndex', '4')//传递的值
        },
    }
}
</script>

父组件：

<script>
import Bus from './../bus.js'
export default {
    data() {
      return {
            menuIndex:""
        }
    },
    mounted() {
        Bus.$on("menuIndex", (val) => {
          this.menuIndex = val;
        });
      },
}
</script>

方法二：监听sessionStorage

在main.js中添加

Vue.prototype.resetSetItem = function (key, newVal) {
  if (key === 'ulIndex') {
    // 创建一个StorageEvent事件
    var newStorageEvent = document.createEvent('StorageEvent')
    const storage = {
      setItem: function (k, val) {
        sessionStorage.setItem(k, val)
        // 初始化创建的事件
        newStorageEvent.initStorageEvent('setItem', false, false, k, null, val, null, null)
        // 派发对象
        window.dispatchEvent(newStorageEvent)
      }
    }
    return storage.setItem(key, newVal)
  }
}

在要监听的页面中使用：

<script>
export default {
    data() {
      return {
            ulIndex:sessionStorage.getItem("ulIndex")
        ? sessionStorage.getItem("ulIndex")
        : "1",
        }
    },
   created() {
    window.addEventListener("setItem", () => {
      this.ulIndex = sessionStorage.getItem("ulIndex")
        ? sessionStorage.getItem("ulIndex")
        : "1";
    });
  },
}
</script

修改值的页面：

goRouter(row) {
      if (row == "purchase") {
        sessionStorage.setItem("menuIndex", "7");
        this.resetSetItem("ulIndex", "0");
      }else{
        sessionStorage.setItem("menuIndex", "8");
        this.resetSetItem("ulIndex", "0");
      }
      this.$router.push({
        name: row,
      });
    },