咨询对象时，JSON Fetch返回未定义

由 发布于

I have a pricing table with variable plans. When an user configure your plan, the href of button is updated according with a json file. The code stores each plan variables and return the correct link throught an array of objects.

这是JSON示例；

[{
   "planName": "PRO",
    "links": {
        "monthly": {
            "plan1": "https://example.com", 
            "plan2": "https://example.org"
        },
        "yearly": {
            "plan1": "https://example.net", 
            "plan2": "https://example.com"
        }
    }
}]

我获取了获取的数据，但是我的对象返回未定义的信息，例如，我无法获取每月>计划1的信息。

波纹管是代码。

function changeLinkWithJSON() {
  var planDuration = document.querySelector('[data-type]').attributes[0].nodeValue;
  var planName = document.querySelector('[plan]').innerHTML;
  var planRef = 'plan1';
  var button = document.querySelector('.select');
  var num;
  if (planName == 'PRO') {
    num = 0
  };
  if (planName == 'PLATINUM') {
    num = 1
  };

  async function getPlanData() {
    let response = await fetch("/plans.json");
    let data = await response.json();
    return data;
  }

  getPlanData()
    .then(data => console.log(data[num].links.planDuration));

}
changeLinkWithJSON();
<ul>
  <li data-type="montly">
    <h2 plan>PRO</h2>
    <a class="select" class="plan-link" href="#">Buy Plan</a>
  </li>
</ul>

如何返回预期结果而不是未定义？