Question

在我的父渲染函数中，我渲染了一个表单输入列表。它们可以是数字、滑块、文本等，对于每一个，我都有一个自定义的 Vue 组件，即 FormInputSlider。我从 API 接收一些数据，然后有这些不同输入的数组来呈现。在我父母的渲染代码中做一个巨大的 if/else 块似乎无法维护，那么当我在列表迭代中遇到“表单输入滑块”时，渲染 FormInputSlider 组件的最佳/标准方法是什么？我来自 React 对世界价值的理解。

Answer 1

如果您有组件名称，则可以使用内置的 component 标记动态呈现组件：

<component :is="dynamicName" />

而不是：

 <template v-if="dynamicName==='abc'">
    <abc/>
 </template>
 <template v-elseif="dynamicName==='xyz'">
    <xyz/>
 </template>
....

推荐的有条件渲染自定义 Vue 组件的方式

1 个答案: