vue标签内循环数据逗号分隔<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>vue标签内循环数据逗号分隔</title>
<script src="unpkg/vue/dist/vue.js"></script>
</head>
<body>
<div id="app">
<template>
<span v-for="(item,index) in nameData">
{{ index == nameData.length-1 && item.name || (item.name + ',') }}
</span>
</template>
</div>
<script>
var Main = {
data() {
return {
nameData: [
{
name: '张三'
},
{
name: '李四'
},
{
name: '王五'
},
{
name: '赵六'
}
]
};
vue逗号分割的字符串转数组}
}
var Ctor = d(Main)
new Ctor().$mount('#app')
</script>
</body>
</html>
⽅法⼆：
<span v-for="(item, index) in nameData" :key="index">
{{ item.name }}
<template v-if="index < nameData.length - 1">、/template>
</span>

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。