如何在vuejs中获取特定的对象值？

Question

我有这样的对象数据

"data":[{ "id": 1, "name": "Lorem Ipsum Name","address": "Lorem Ipsum Street" }]

我需要获取诸如name之类的特定值，所以我使用

{{ data[0].name }}

成功显示其工作和名称，但出现此错误

[Vue warn]: Error in render: "TypeError: Cannot read property '0' of undefined"

有人可以帮我吗？非常感谢

Answer 1

我猜您的应用程序结构如下：

new Vue({
  el: '#app',
  data: [{ "id": 1, "name": "Lorem Ipsum Name","address": "Lorem Ipsum Street" }]
})

我认为您不能像Vue中那样直接从数据对象中获取数组值。尝试将其更改为此：

new Vue({
  el: '#app',
  data: {
    "data": [{ "id": 1, "name": "Lorem Ipsum Name","address": "Lorem Ipsum Street" }]
  }
})

该小提琴有助于实验：https://jsfiddle.net/chrisvfritz/50wL7mdz/

Answer 2

您可以使用$data获取数据对象属性。

因此，您可以执行以下操作（https://jsfiddle.net/tenkz5j9/3/）：

<p>{{ $data[0].id }}</p>