Vuejs 动态指令 v-for 循环答案

【问题标题】：Vuejs dynamic directives v-for loopVuejs 动态指令 v-for 循环
【发布时间】：2018-12-17 10:16:16
【问题描述】：

我有以下代码，但显示文本并且不实例化步骤。

我怎样才能做到这一点？

模板：

<template>
    <div>
        <ul>
            <li v-for="(step, index) in $store.state.steps" >
                <{{`step-${index+1}`}}></{{`step-${index+1}`}}>
            </li>
        </ul>
    </div>
</template>

输出：

<step-1></step-1>
<step-2></step-2>
<step-3></step-3>
<step-4></step-4>
<step-5></step-5>
<step-6></step-6>
<step-7></step-7>

【问题讨论】：

你的意思是你有 n 个名为 step-1 到 step-n 的组件，并且想用 v-for 渲染它们吗？
@ChristhoferNatalius 是的，请:)

标签： vuejs2 vue-directives

【解决方案1】：

在此处阅读文档https://vuejs.org/v2/guide/components-dynamic-async.html

<component v-bind:is="currentComponent"></component>

【讨论】：