vue provide inject响应式 子组件修改祖先组件的值

祖先组件

  provide () {
    return {
      activeName: { activeName: this.activeName,
                    changeActiveName: this.changeActiveTab },
    }
  },
    methods: {
    changeActiveTab (item) {
      this.activeName = item.value
    },
  },

子组件

  inject: ['activeName'],
  methods: {
    goTotalPage () {
      this.activeName.changeActiveName({ value: 'all' })
    },
  },

通过provide 变量可以通过传递方法 我们可以从子组件里面调用祖先组件的方法并传递值,从而达到子组件修改祖先组件的值

依赖注入 | Vue.js

猜你喜欢

转载自blog.csdn.net/weixin_44383533/article/details/129823038