如何从acf.maps字段获取数据?

时间:2019-05-25 11:53:06

标签: javascript fetch

我试图从Wordpress API进行简单的提取。在这种情况下,请来自“ ACF字段”。

使用代码:

我得到回应。但是如果我尝试 添加

$ {post.acf.address}

没有数据。但是,为什么有谁可以帮助我呢?

代码如下:

function getPosts() {
  fetch(
    "https://localhost/wp-json/wp/v2/tourplan?per_page=100"
  )
    .then(res => res.json())
    .then(data => {
      let output = '<h2 class="mb-4">Posts</h2>';
      data.forEach(function(post) {
        output += `
                  <div class="card card-body mb-3">
                    <h2>${post.acf.location}</h3>
                    <h3>${post.acf.programmname}</h3>
                    <p>${post.acf.datum}</p>
                    <p>${post.acf.beginn}</p>
                  </div>
                `;
        console.log(data);
      });
      document.getElementById("output").innerHTML = output;
    });
}

这是json响应,如果您在浏览器中调用提取网址。

[
    {
        "id": 5692,
        "date": "2019-05-08T14:41:15",
        "date_gmt": "2019-05-08T12:41:15",
        "guid": {
            "rendered": "https://localhost/?post_type=tourplan&#038;p=5692"
        },
        "modified": "2019-05-08T14:41:15",
        "modified_gmt": "2019-05-08T12:41:15",
        "slug": "münchen",
        "status": "publish",
        "type": "tourplan",
        "link": "https://localhost/Tourplan/münchen/",
        "title": {
            "rendered": "München"
        },
        "content": {
            "rendered": "",
            "protected": false
        },
        "template": "",
        "authorName": "wtced",
        "acf": {
            "plz": "81825",
            "location": "Wirtshaus",
            "programmname": "\"Programmname\"",
            "datum": "20190913",
            "einlass": "18:00",
            "beginn": "20:00",
            "ticketlink": "https://localhost/hxanh/",
            "ausverkauft": false,
            "vvk": "Veranstalter: Testverein e.V.",
            "zusatzfeld": "",
            "maps": {
                "address": "Feldstraße 35, 81825 München, Deutschland",
                "lat": "48.386076050384",
                "lng": "11.348405060504"
            }
    }
]

2 个答案:

答案 0 :(得分:0)

formArrayItemDirective属性在address属性maps

并非每个post对象都具有maps属性,因此您需要检查该字段是否存在

${post.acf.maps.address}

答案 1 :(得分:0)

谢谢大家,代码还可以。失败的原因是结果太多。