vue 不在同一处（不是同一个页面）的数据使用（数据传输）

vue 不在同一处（不是同一个页面）的数据使用（数据传输）

整理下最近在做vue项目时遇到的几个关于数据传输的问题：
有的时候我们在同一个页面想要调用不同的组件，不同的组件可能只是结构不太一样，但是请求的是同一个接口，使用的数据也是一样的
在公共的文件中你请求了接口，所有数据都在这一个文件中获取了，那么在调用不同组件的时候怎么使用呢？
代码：

//公共的地方请求数据
getScoreData() {
            this.$api.get('/okr/score', {period: this.period, plan_id: this.plan_id}, ({errcode, data}) => {
            if (errcode === 0) {
                this.okr_data = data.data;
                this.okr_weight = data.weight;
                this.appraisal_data = data.detail;
                this.appraisal_weight = data.appraisal_weight;
                this.assess_data = data.assess_data;
                this.assess_data.forEach(self => {
                    if (self.title == '自评总结') {
                        this.self_text = self.text
                    }
                    return this.leader_text = self.text
                })
                this.okr_score = data.score;
                this.appraisal_score = data.appraisal_score;
                if (this.okr_score == 0 && this.appraisal_score == 0) {
                    this.sumScore = '-'
                } else {
                    this.sumScore = this.okr_score + this.appraisal_score;
                }
                this.config = {...data.config}
                this.if_can_edit = data.can_edit;
                this.$emit('getState', this.if_can_edit)
                this.$emit('getSumScore', this.sumScore)
            }
        })
    },
//在provide 中定义一个指代所有已经获取到的数据
  provide() {
      return {
          score_parent:this
      }
  },
  
//在调用的不同组件中使用inject来接收数据
inject:[
    'score_parent'
],

//使用的时候
score_parent.okr_weight
//或者
this.score_parent

这个方法有点类似于props接收数据，但是props针对于数据少的情况是比较好的，
provide，inject针对于所传输的数据量大的时候。

仅仅是一次记录，欢迎提意见！