未定义计算

Question

我遇到一个未定义计算的错误，我似乎找不到解决方法，即使将它放在 computed: {}

中也是如此

<template>
  <component :is="tag" v-html="sanitizedContent" />
</template>
<script>
import { defineComponent } from "@nuxtjs/composition-api";

import DOMPurify from "isomorphic-dompurify";

export default defineComponent({
  name: "HTMLContent",
  sanitizedContent: computed(() => DOMPurify.sanitize(props.content)),
  props: {
    tag: {
      type: String,
      default: "div",
    },
    content: {
      type: String,
      default: "",
    },
  },
});
</script>

Answer 1

您是否尝试导入它：

import { computed } from "vue";

和：

const sanitizedContent = computed(() => DOMPurify.sanitize(props.content))

Answer 2

通过查看您的代码，您可以像这样改进它：

从"@nuxtjs/composition-api"导入缺失的computed，并添加缺失的setup函数，返回你想要的值。

<template>
  <component :is="tag" v-html="sanitizedContent" />
</template>
<script>
import { computed, defineComponent } from "@nuxtjs/composition-api";
import DOMPurify from "isomorphic-dompurify";

export default defineComponent({
  name: "HTMLContent",
  props: {
    tag: {
      type: String,
      default: "div",
    },
    content: {
      type: String,
      default: "",
    },
  },
  setup(props) {
    return {
      sanitizedContent: computed(() => DOMPurify.sanitize(props.content)),
    }
  }
});
</script>

未定义计算

Computed is not defined

debugging

vue.js

vuejs2

nuxt.js

vue-composition-api