在 p5.js 中使用来自 Datamuse API 的 JSON 数据时遇到问题

Question

所以我想构建一个非常简单的网络应用程序，用户可以在其中输入一些文本，然后根据相同的文本创建一个段落。段落中的每个词都在一个 span 标签内，因此当用户将鼠标悬停在它上面时，该词的同义词会显示在控制台上。

我很确定导致问题的代码部分是这样的：

var lookupLink;
var data;
function preload(){
    lookupLink = 'https://api.datamuse.com/words?ml=';
}
function changeWord(){
    data = loadJSON(lookupLink+this.html())
    var index = floor(random((Object.keys(data).length)));
    console.log(data[index].word);
    //the above console.log gives an error.
}

为了以防万一，这里有完整的代码：https://pastebin.com/ViNZ1jse

它没有记录单词，而是显示：

Uncaught TypeError: Cannot read property 'word' of undefined
    at p5.Element.changeWord (sketch.js:39)

我猜这是因为当我尝试记录其中一个属性时数据对象尚未完成加载，但我不知道如何解决这个问题。编辑：哦，我忘了提还有另一个问题，我可以从 https://api.datamuse.com/words?ml= link 而不是 https://api.datamuse.com/words?rel_syn=link 加载数据。

Answer 1

https://p5js.org/reference/#/p5/loadJSON

loadJson 可以接收一个回调，该回调将在您的 json 加载时执行。所以我认为这会起作用：

loadJSON(lookupLink+this.html(), function(data) {
  var index = floor(random((Object.keys(data).length)));
  console.log(data[index].word);
})

在 p5.js 中使用来自 Datamuse API 的 JSON 数据时遇到问题

trouble using JSON data from Datamuse API in p5.js

javascript

api

p5.js