使用 nuxt-composition-api 在路由更改上重新初始化 Vue3 可组合函数

Posted

技术标签:

【中文标题】使用 nuxt-composition-api 在路由更改上重新初始化 Vue3 可组合函数【英文标题】:Reinit Vue3 composable function on route change, using nuxt-composition-api 【发布时间】:2021-09-17 08:23:55 【问题描述】:

我有一个动态 id 的路由,例如 post/:postId 和包含很多方法和函数的可组合函数。

当我从路线 post/1 转到 post/2 时,可组合没有更新,我得到了 id 1 的信息

如何强制重新初始化可组合函数?

<script>
import postFunctions from '~/composable/postHelpers';
import  useContext  from '@nuxtjs/composition-api';

setup() 
   const  store, params  = useContext();
   const  postComments, updatePostText  = postFunctions(params.value.postId)


【问题讨论】:

【参考方案1】:

我在 nuxt-child 属性中使用了一个键,组件现在完全重新渲染

  <nuxt-child :key="$route.fullPath" />

【讨论】:

以上是关于使用 nuxt-composition-api 在路由更改上重新初始化 Vue3 可组合函数的主要内容,如果未能解决你的问题,请参考以下文章