过滤JSON数据并追加到div

Question

我有一个本地JSON文件，我试图从中过滤数据并将该数据附加到html文件中的div中。我无法在控制台中看到数据，因此不确定不确定我在做console.log时是否操作不正确（请参见下文），或者根据范围“是否无法访问”数据。

JS文件：

import $ from 'jquery';
import jsonData from "./test.json";

function _loadDispForm() {
        let dispData = jsonData.d.results.filter(x => {
            return {
                "Title": x.Title,
                "GoalRange": x.GoalRange,
                "Office": x.Office,
                "Role": x.Role,
                "IsFilled": x.IsFilled,
                "Employee": x.Employee,
                "IsActive": x.IsActive,
                "Notes": x.Notes
            }

        })      
        $("#display-form-job-title").append("Title");

        console.log(x.Title);
        console.log(JSON.stringify(dispData));
    }

JSON代码段：

{
  "d": {
    "results": [
      {
        "FileSystemObjectType": 0,
        "Id": 1,
        "Title": "TitleHere",
        "GoalRange": "3",
        "Office": "Somewhere",
        "Role": "FPSL",
        "IsFilled": false,
        "Employee": null,
        "IsActive": true,
        "Notes": null,
        "ID": 1,
        "Attachments": false
...etc

HTML片段：

<div class="col-6">

  <h3 id="display-form-job-title"></h3>

在大多数情况下，其他键值的HTML标记与此类似。

Answer 1

如其他答案所述，您很可能应该使用.map（“将长度N的数组变形为新的长度N的数组”），而不是.filter（“返回长度<= N长度为N的数组，仅包含满足条件的元素”）。

a = [1,2,3]
console.log(a.map(a => a + 1)) // [2,3,4]
console.log(a.filter(a => a == 2)) // [2]
console.log(a.filter(a => a > 1)) // [2,3]