JSONForms Vue基本字符串自定义呈现器

edqdpe6u 于 2023-04-21 发布在 Vue.js

关注(0)|答案(1)|浏览(194)

此bounty已结束，回答此问题可获得+50声望奖励，奖励宽限期20小时后结束，5uperdan希望引起更多关注此问题。

所以我从Vue JSONForms开始，我试图创建一个基本的自定义文本渲染器。我知道JSONForms有vue-vanilla包，但我想了解自定义渲染器所需的基础知识，因为稍后我将需要对我创建的每个自定义渲染器进行更多的自定义。以下是我到目前为止所做的：

<template>
    <v-input />
</template>

<script lang="ts">
import { ControlElement, JsonFormsRendererRegistryEntry, rankWith, isStringControl } from '@jsonforms/core'
import { useJsonFormsControl, RendererProps } from '@jsonforms/vue'
import { defineComponent } from 'vue'

const renderersText = defineComponent({
    name: 'renderers-text',
    setup (props: RendererProps<ControlElement>) {
        return useJsonFormsControl(props)
    },
})

export default renderersText

export const entry: JsonFormsRendererRegistryEntry = {
    renderer: renderersText,
    tester: rankWith(1, isStringControl),
}
</script>

但是我得到了一个r.tester is not a function错误。你知道这意味着什么和/或我需要修复什么吗？提前感谢！

vue.js

来源：https://stackoverflow.com/questions/75287976/jsonforms-vue-basic-string-custom-renderer

1条答案

按热度按时间

zaq34kh61#

在Jsonforms Vue模板中，渲染器是这样添加的

const renderers = Object.freeze([
    ...vanillaRenderers,
    // here you can add custom renderers
])

vanillaRenderers集合（类型为any[]）实际上是JsonFormsRendererRegistryEntry对象的集合。如果向集合中添加renderer对象，则会出现错误r.tester is not a function，例如：

const renderers = Object.freeze([
    ...vanillaRenderers,
    renderersText,
])

相反，请确保添加一个JsonFormsRendererRegistryEntry对象，您可以完整地定义该对象

const renderers = [
  ...vanillaRenderers,
  {
    tester: rankWith(
      1,
      isStringControl,
    ),
    renderer: renderersText,
  }
];

赞(0）回复(0）举报 2023-04-21

我来回答

JSONForms Vue基本字符串自定义呈现器

1条答案

相关问题

热门标签

最新问答