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
   })
}