私のAPIの値をvue-headで頭の中に渡すにはどうしたらいいですか？

Question

私はウェブサイトでvue-headを使用しています。プログラムの名前をhtmlの頭とinfに渡さなければならないからです。それはAPIから来ているので、私は要求をするが、すべての時間が私は名前を渡すためにしようと、それは私がこのコードエラー送る：あなたはこの問題で私を助けることができる場合

export default { 
    data:() => ({ 
    errors: [], 
    programs: [], 
    firstVideo: {}, 
    vidProgram: {} 
    }), 
}, 
    created() { 
    //do something after creating vue instance 
    this.api = new ApiCanal({}) 
    this.getProgram() 
    }, 
    methods: { 
    getProgram() { 
     this.api.http.get(`videos/program/${this.programSlug}`) 
     .then(response => { 
      this.programs = response.data 
      this.firstVideo = response.data[0] 
      this.vidProgram = response.data[0]['program'] 
     }) 
     .catch(error => { 
      this.errors = error 
     }); 
    } 
    }, 
    head: { 
    //this is the inf. for the head 
    title: { 
     inner: this.programs.name, 
     separator: '-', 
     complement: this.programs.info 
    } 
    } 
} 

は、私は本当に感謝しますが

Answer 1

titleのVueオブジェクト/コンポーネントのプロパティを使用する場合は、thisがVueコンポーネントを作成するオブジェクト（おそらくグローバルwindowオブジェクト）を参照するため、make it a functionが必要です。

head: { 
    title: function() { 
    return { 
     inner: this.programs.name, 
     separator: '-', 
     complement: this.programs.info 
    }; 
    } 
}