javascript - 循环显示json数据

Question

如何循环 json 数据并使用qtip显示？

 elements: {
    "nodes": [
            {
            "data": {
                "id": "a2345",
                "name" : "b1234"
                "type": "test", 
                }
            },
            {
            "data": {
                "id": "a212",
                "name" : "c34"
                "description": "hellooo", 
                }
            },
     ],
     },
});


cy.nodes().qtip({
    content:function(){     
            return ' id: '+ this.data('id') 
            +' name: '+ this.data('name')  
            + ' type: '+ this.data('type') 
            + ' description: '+ this.data('description')
    },

});

电流输出：

node1 - id：a2345，名称：b1234，类型：测试，描述：未定义

node2- id：a212，名称：c34，类型：未定义，描述：hellooo

预期输出：

node1 - id：a2345，名称：b1234，类型：test

node2 - id：a212，名称：c34，描述：hellooo

任何帮助表示赞赏。谢谢！

标签： javascriptjson

Answer 1

@Averill，让我从一个简单的纯 JavaScript 代码示例开始，它将打印您期望的字符串。

在这里，我展示了如何构造要返回的字符串。最后我更新了你的代码部分。

示例代码示例（JS）：

var arr = [
        {
        "data": {
            "id": "a2345",
            "name" : "b1234",
            "type": "test", 
            }
        },
        {
        "data": {
            "id": "a212",
            "name" : "c34",
            "description": "hellooo", 
            }
        },
]

var i = 1;
for(var obj of arr) { // iterating over arr
   var data = obj["data"]; // data object
   var string = "node" + i + " - id: " + data["id"]+ ", name: " + data["name"]

    // Deleting values with fixed keys
   delete data["id"]
   delete data["name"]

    for(var key in data) { // iterating over remaining eys
       string += ", " + key + ": " + data[key];
    }

   console.log(string);
   i += 1;
}

输出：

node1 - id: a2345, name: b1234, type: test
node2 - id: a212, name: c34, description: hellooo

现在，根据上面的代码示例查看下面的代码。

如果以下代码示例不能满足您的问题，请发表评论。我会检查并更新它。

  // You have edited your code from this point
      var i = 1;
      cy.nodes().qtip({
          content:function(){  
            var string;
            if(this._private["index"] == undefined){
              this._private["index"] = i;
              string = "Node" + i + " - " + "id: "+ this.data("id")+ ", name: " + this.data("name")
              i += 1
            } else {
              string = "Node" + this._private["index"] + " - " + "id: "+ this.data("id")+ ", name: " + this.data("name")
            }

            // Deleting values with fixed keys
            delete this.data("id")
            delete this.data("name")

            console.log(this.data)
            console.log(this._private.data)
            console.log(this)
            for(var key in this._private.data) { // iterating over remaining keys
              string += ", " + key + ": " + this.data(key)
            }


            return string
          },

        style: {
          classes: 'qtip-bootstrap',
        }, 
      });     

检查下面的截图。