基于v-for中的条件添加vue组件

你可以用 v-if :

<div v-for="(loop, index) in loops" :key="index">
    <text-block v-if="loop.type === 'text'"></text-block>
    <image-block v-if="loop.type === 'image'"></image-block>
</div>

<div v-for="(loop, index) in loops" :key="index">
    <component :is="loop.type + '-block'"></component>
</div>

你可以这样做,假设在一个数组中有电影列表:

<div id="app">
<ul>
<li v-for="movie in movies">{{ movie }}</li>
</ul>
</div>
<script>

var app = new Vue({

el: '#app',
data: {
  movie: ['some movie 1', 'movie 2', 'idk movies man']
}

});

setTimeout(function() {
app.movies.push('random movie');

}, 2000);

</script>