Vue + Laravel:如果元组数据之一中的表单数组中的数据如何从api挂载数据

时间:2019-03-27 19:04:37

标签: javascript arrays laravel vue.js

我有来自API的数据,但无法将数组中的数据设置为vue.js中的this.data 这是来自API的数据(JSON)

能告诉我有关此语法的信息吗

SELECT `table_1`.`t1_text` AS 'Text', `table_1`.`t1_date` AS 't1_date', `table_2`.`t2_text` AS 't2_Text', `table_2`.`t2_date` AS 'Date' 
FROM `table_1` 
LEFT JOIN `table_2` ON `table_1`.`t1_id`=`table_2`.`t1_id` 
ORDER BY `table_1`.`t1_date` DESC 
LIMIT 10

我在审查中遇到问题,因为它是一个数组。

我无法将API中的数据设置为vue中的数据

{"id":1613,
"name_org":"US company",
"picture":"default.jpg",
"headerpic":"no-preview.png",
"description":null,
"address":null,
"type":"hardware,software,network",
"rating":0,
"created_at":"2019-03-27 18:50:51",
"updated_at":"2019-03-27 18:50:51",
"review":[{
       "review_id":3,
         "org_id":1613,
         "user_id":2,
         "description":"Very good",
         "rating":3,
         "created_at":null,
         "updated_at":null}, 
      {"review_id":4,
         "org_id":1613,
         "user_id":1,
         "description":"Not bad",
         "rating":5,
         "created_at":null,
         "updated_at":null}]
 }

1 个答案:

答案 0 :(得分:1)

由于您的API响应是一个对象,因此请在data下定义一个空对象。

data() {
    return { 
        orgsData: {} 
    }
}

然后将其与您的API一起使用,如下所示:

this.orgsData = response.data

并将其附加到您的HTML

<div v-for="review in orgsData.reviews" class="box">{{review.review_id}}</div>

希望有帮助!