在Vue.js中，我给后端传输数据，格式如下,后端返回给我的是一样的，问我怎把这些数据渲染在我页面中呢

Question

在Vue.js中，我给后端传输数据，格式如下,后端返回给我的是一样的，问我怎把这些数据渲染在我页面中呢，格式如下

           {name:"小明"，id:1,value:"0 08:00 17:30 05 16"},
           {name:"小张"，id:2,value:"3 08:00 17:30 05 16"}
           

解释一下 name是名字，id是ID，

value第一个值是用户选择的下标(因为我用的是select。就是里面的下标对应的文字)；
            如图
    

每天就是0，每周就是1，每月就是2，每年就是3

            value第二个值是用户选择的开始的时间
            如图

        value第三个值是用户选择的结束的时间
        如图

     value第四个值和第五个值是用户选择的月份和日
            如图
            

请问我怎么才能按照后端返回的字段直接渲染在页面上呢？
请大家广集思路，帮忙出谋划策

Answer 1

1.获取到后台的信息：
data = {name:"小明"，id:1,value:"0 08:00 17:30 05 16"}
2.将上述信息中的value字段切割并保存在另外一个变量中
arrayValue = data.value.split(" ");
更有语义化的：
this.frequency = arrayValue[0]
this.start = arrayValue[1]
this.end = arrayValue[2]
...
3.保存的时候再将this.frequency等字段拼成空格连接的字符串

以上是大致思路

Answer 2

可以将提交的数据拆分出来，后端返回的也是处理过的数据，每个选框对应一个字段就可以分别绑定处理了

Answer 3

前面的正常写，后面的直接用数组的形式写上去，不要拆分之类的，data.value[0]这种，直接写到该渲染的地方