如何防止在通过 nuxt-link 转到 child 页面时调用 parent fetch() 挂钩？这是一个错误吗？

Question

我对 parent fetch() 挂钩有问题，它在通过 nuxt-link 转到 child 页面期间被调用。如何解决这个问题？也许是 nuxt.js 错误？为了实现 parent -> child 结构，我根据 nuxt.js 文档中给出的模式设置了我的项目：
-parent.vue
-parent
--child1.vue
--child2.vue

例如，通过 nuxt-link 转到 Child1：<nuxt-link to="/parent/child1">Child1</nuxt-link> 导致在 parent.

中调用 fetch() 挂钩

我想很多人都有这个问题。预先感谢您帮助解决此问题。

Answer 1

看看Vue自定义选项合并策略https://vuejs.org/v2/guide/mixins.html#Custom-Option-Merge-Strategies

~/plugins/custom-merge-fetch.js

import Vue from 'vue'

Vue.config.optionMergeStrategies.fetch = function (childFetch, parentFetch) {
  // your logic
}

并且在nuxt.config.js

plugins: [
  '~/plugins/custom-merge-fetch',
],

Answer 2

我已经找到解决办法了，很简单。就我而言，我忘记了为 nuxt-child 添加默认页面（在 parent 文件夹中创建 index.vue 文件），如下所示：
-parent.vue
-parent
--index.vue
--child1.vue
--child2.vue

执行此操作后，问题得到解决，parent fetch() 挂钩不再调用。以前，child页默认不生成DOM结构（index.vue文件未创建），导致parent刷新，当去child 页面通过 nuxt-link.

如何防止在通过 nuxt-link 转到 child 页面时调用 parent fetch() 挂钩？这是一个错误吗？

How to prevent calling parent fetch() hook, when going to child page through the nuxt-link? Is it a bug?

hook

parent-child

fetch

nuxt.js