VueJS v-只重复一次

Question

我目前使用 v-repeat 来获取我的对象。在里面我还有一个 v-repeat，但这应该只重复一次。这可能吗？

<div v-repeat="companies">
{{name}}
   <div v-repeat="image: images"> // should only repeat once
     {{image.name}}
   </div>
</div>

Answer 1

我不完全确定这是否是您所追求的，但这里是：

<div v-repeat="company: companies">
{{company.name}}
   <div>
     <img v-attr="src: company.image.url"/> 
     {{company.image.name}}
   </div>
</div>

这是假设每个公司只有一张图片

Answer 2

如果每个公司都有很多图片，而您只想显示第一张图片，解决方法如下：

<div v-repeat="company in companies">
    {{company.name}}
    <img v-attr="src: company.images[0].url"> 
    {{company.images[0].name}}
</div>

VueJS v-只重复一次

VueJS v-repeat only once

javascript

vue.js