后端返回的数据需要前端进行分割处理?

img

img


图一是原稿,图二是后端返回的数据,想知道怎么把图二的数据切割成几个span?

可以先split专为数组后,用v-for对数组进行循环

img


<script src="https://unpkg.com/vue/dist/vue.js"></script>
<style>
    .item{background:#d6edfc;color:#ab7bfa;padding:2px 5px;display:inline-block;margin-right:10px}
</style>
<div id="app">
    <div v-for="item in list" class="item">{{item}}</div>
</div>
<script>
    new Vue({
        el: '#app',
        data: { list: [] },
        mounted() {
            setTimeout(() => {//计时器模拟异步查询
                var s = '测试1,测试2,测试3,测试4,测试5';//返回的字符串,英文状态下逗号隔开
                this.list = s.split(',');//注意分隔符,如果不是英文状态下逗号,改下这里

            },1000);
        }
    });
</script>



let arr = '1,2,3'.split(',');
// ["1", "2", "3"]

假如你后端返回的数据字符串result

var arrs=result.split(",");
arrs.forEach(function (item) {
console.log(item);
})

看着好像有逗号,看着你的标签是vue,
你可以将字符串转化成数组,然后v-for一下,看字符串转数组的例子

    var string = '123,456,789';
    var arr = string.split(',');
    console.log(arr)