vue多个人名如何逗号分隔？

Question

我想要的效果：

我自己的效果：

<p>参与人：<span v-for="item in list.participant">{{item.name}}</span></p>

该怎么实现呢？

Answer 1

我简单修改了下
http://jsrun.net/DyXKp/edit

Answer 2

p span:after{ content:",";}
p span:last-child:after{content:"";}

Answer 3

<span>{{list.participant.map(i=>i.name).join(',')}}</span>

Answer 4

p span:after{ content:",";}
p span:last-child:after{content:"";}
这个容易操作

Answer 5

用spilt做一下处理

Answer 6

<p>参与人：<span v-for="(item, index) in list.participant" :key="index">{{index === list.participant.length - 1 ?item.name : item.name + ','}}</span></p>