我们如何从 JSON 响应中访问包含连字符的数据？ [复制]

Posted 2023-02-23

【中文标题】我们如何从 JSON 响应中访问包含连字符的数据？ [复制]

【英文标题】：How can we access hyphen included data from the JSON response? [duplicate]

【发布时间】：2019-08-07 20:32:18

【问题描述】：

我正在使用 vuejs 和 axios，我正在尝试从 wordpress 获取博客文章，除了一件事外一切正常，我正在尝试从响应中提取缩略图，但响应数据包含连字符，所以我无法访问对象，显示错误。这是我要访问的内容

family._embedded['wp:featuredmedia']['0'].media_details.sizes.family-profile-thumb.source_url

这里family 是一个道具，family-profile-thumb 是具体尺寸，我无法更改，这部分会造成问题，如果我将其替换为默认尺寸（如 thumb）它将起作用，例如：

family._embedded['wp:featuredmedia']['0'].media_details.sizes.thumbnail.source_url

有没有办法完成这项工作？

【问题讨论】：

.["family-profile-thumb"].

正如我所说我使用的是 Vuejs，所以在模板中我使用的是这样的 如果我替换缩略图并按照您提供的方式添加将不起作用，即使我将双引号更改为单引号，对吗？

你也可以查看这个要点gist.github.com/hygull/df535d30cdd20afc2a6e17aaa292494b。

【参考方案1】：

使用方括号表示法访问它：

family._embedded["wp:featuredmedia"]["0"].media_details.sizes["family-profile-thumb"].source_url

【参考方案2】：

只要属性名称不是有效的 JS 标识符，您就需要使用[] 括号表示法来访问该属性。

什么是有效的 JS 标识符？

属性名称不应以 digit 开头，例如 -> 1d alphanumeric, underscore and $ 以外的任何内容均无效e.g -> 'hello-world'

let a = 
  "hello-world" : 'some value'


console.log(a['hello-world'])
console.log(a.hello-world)

你可以在这里阅读更多信息MDN reference