vue props 從父組件傳遞到子組件

Question

我有一個容器組件，里面有一個導航欄組件。 我在 beforeCreate 中調用了 api，然后在此處設置變量，並將它們設置為 vue 'state'（數據），然后將它們作為道具傳遞給導航欄組件。 但是，這些都沒有出現。 我在這里做錯了什么？

<template>
<Navbar :title='title' />
<template>

<script>
export default{
name:'example',
data(){
    return{
        title:''
    };
},
beforeCreate: function(){
    axios.post('')
    .then(response => {
        this.title = response.title
   })
}
}
</script>

我已經控制台記錄了來自 api 的響應數據，所以我知道它正在正確生成數據。 我還在已安裝的生命周期中控制台記錄了數據變量“標題”，它有數據。 但是導航欄的道具仍然是空的。

Answer 1

beforeCreate在數據觀察之前被調用。 使用beforeMount重試

Answer 2

只需在beforeCreate生命周期方法中，您的data object 尚未加載，因此您此時無法調用它，因此使用created方法的最佳實踐

之前創建（）

這是在 Vue JS 中調用的第一個生命周期鈎子，它在 Vue 實例初始化后立即調用。

創建（）

在beforeCreated鈎子之后調用的第二個生命周期鈎子。 在這個階段，Vue 實例已經被初始化並激活了計算屬性、觀察者、事件、數據屬性和隨之而來的操作的開始。

created: function(){
    axios.post('')
    .then(response => {
        this.title = response.title
   })
}