<q-input v-model="renderedHtml" type="textarea" outlined label="发票备注" dense clearable :rows="3" :readonly="true" style="background-color: #f5f5f5;border-radius: 4px;color: #555;width: 174.4%;"> </q-input> const renderedHtml = computed(() => { return DOMPurify.sanitize(event.submitData.REMARK) })

在你的代码中，你使用了 `<q-input>` 组件来展示富文本内容，并将其设置为只读。

如果你想要使用 DOMPurify 库来过滤和清理 HTML 内容，你需要在组件中引入 DOMPurify，并使用 computed 属性来生成经过过滤处理的 HTML 内容。以下是一个示例：

<template>
  <q-input v-model="renderedHtml" type="textarea" outlined label="发票备注" dense clearable
           :rows="3" :readonly="true"
           style="background-color: #f5f5f5;border-radius: 4px;color: #555;width: 174.4%;">
  </q-input>
</template>

<script>
import DOMPurify from 'dompurify';

export default {
  data() {
    return {
      event: {
        submitData: {
          REMARK: '<p>这是一段包含<br>换行的 HTML 代码</p>'
        }
      }
    };
  },
  computed: {
    renderedHtml() {
      return DOMPurify.sanitize(this.event.submitData.REMARK);
    }
  }
};
</script>

在上面的示例中，我们首先引入了 DOMPurify 库。然后，在 computed 属性 `renderedHtml` 中，我们使用 DOMPurify 的 `sanitize` 方法来过滤和清理 `event.submitData.REMARK` 的 HTML 内容。最后，我们将过滤后的内容绑定到 `<q-input>` 组件的 `v-model` 上。

这样，经过 DOMPurify 过滤处理后的 HTML 内容将会显示在只读的 `<q-input>` 组件中。

请确保在组件中正确引入 DOMPurify 并安装相关依赖。另外，对于用户输入的 HTML 内容，仍然建议进行适当的验证和过滤，以确保安全性。