Vue.js Nuxt.js |无法读取计算方法返回对象的属性

我使用computed方法动态分配变量并加载我的页面。我可以显示整个对象。但是，我无法显示单个属性。错误消息显示：

无法读取未定义的属性“title”

这是我的“页面”组件的代码（“\u id.vue”）：

>
>     
>{{post}}
>从“axios”导入axios；
>导出默认值{
>数据（）{
>返回{
>id:this.$route.params.id，
>员额：[]
>           }
>         },
>计算：{
>post（）{
>console.log（this.id）；
>返回this.posts.find（post=>post.id==this.id）
>         }
>       },
>异步创建（）{
>等待axios。获取（“https://jsonplaceholder.typicode.com/posts?_limit=3")
>.然后（res=>this.posts=res.data）
>.catch（err=>alert（err））；
>       }
>     } 
> 
> 
> 
> 

据我所知，我会在页面上显示整个对象。如果我更改h1标记，则：

<h1>{{ post.title }}</h1>

{{post.title}

它显示上面提到的错误消息。

---

你能帮我解决这个问题吗。

试试条件渲染：

<h1 v-if="post.title">{{ post.title }}</h1>

{{post.title}

v-if=“post”解决了这个问题。然而，这样的解决方案在专业发展中可以接受吗？@JarekBernatowicz这是最好的方法，也是可以接受的。我觉得很奇怪为什么在vueschool.iosure没有提到它，但是，当

post.title

不存在时，您也可以使用

v-else

指令执行条件呈现，该指令将某些内容显示为

post not found

。我的意思是，你可以在加载时使用一些

悬念

微调器，其他的用于你的

帖子

，当没有结果时，如果你将创建的

视为普通代码，为什么要使用
异步
？。。。我使用的不是axios，而是
fetch
但是
<h1 v-if="post.title">{{ post.title }}</h1>