Nuxt链接与graphQL(apollo)失败；未捕获的TypeError

Question

我的graphQL查询似乎出现了问题，因为模板渲染，但是 nuxt-link 失败。它只是显示了 catrule.ruleid 文本，但不是链接格式。

模板。

<li v-for="catrule in cat_rulesetCollection">
    <nuxt-link :to="`/cat-rule/` + catrule.ruleid">{{ catrule.ruleid }}</nuxt-link>
</li>

Apollo:

import gql from 'graphql-tag'
export default {
    apollo: {
        cat_rulesetCollection: gql` {
            cat_rulesetCollection(populate:1) {
                ruleid
                }
            }`
        }
    }

错误：

Uncaught TypeError: Failed to execute 'observe' on 'IntersectionObserver': parameter 1 is not of type 'Element'.
    at VueComponent.observe (nuxt-link.client.js?4e55:62)

Answer 1

我不知道双引号中的反引号是如何工作的 但我会做一些类似这样的事情。

<nuxt-link :to=`/cat-rule/${catrule.ruleid}`>{{ catrule.ruleid }}</nuxt-link>

或者

<nuxt-link :to="`/cat-rule/` + {{ catrule.ruleid }} ">{{ catrule.ruleid }}</nuxt-link>