javascript - 我们可以将 JSON 对象数组转换为 lightGalery 对象数组吗？

Question

大家好，各位资深Web开发人员，我是Web开发的新手。我使用 lightGallery 插件来查看图像。但是我的图像路径存储在数组中。在从 ajax 响应获得的数组元素中始终是动态的。这是我的数组：

     var data = { "result" : [ 
                                { "file_name"  : "a.jpg" },
                                { "file_name"  : "b.png"},
                                  ......................
                             ]
     }       

// 这是 Lightgallery 数组语法

     $(this).lightGallery({
       dynamic: true,
       dynamicEl: [{"src": 'your image path'}, 
                   {'src': 'your image path'},
                    ........................
                  ]
     })

// 我想要这样：

     $(this).lightGallery({
       dynamic: true,
       dynamicEl: [{"src": 'a.jpg'}, 
                   {'src': 'b.jpg'},
                   ................
                  ]
     })

怎么做？可不可以？

感谢您的宝贵帮助。

Answer 1

Array.prototype.map()便于arrays在原件的基础上进行创作。

请参阅下面的实际示例。

// Input.
const input = {
  result: [ 
    { "file_name"  : "a.jpg" },
    { "file_name"  : "b.png"}
  ]
}

// To Dynamic.
const toDynamic = ({result}) => ({
  dynamic: true,
  dynamicEl: result.map(x => ({src: x.file_name}))
})

// Output.
const output = toDynamic(input)

// Proof.
console.log(output)

Answer 2

您的原件var data实际上是一个对象 - 看看它是如何以{.

const data = { "result" : [ 
  { "file_name"  : "a.jpg" },
  { "file_name"  : "b.png"},
]};
const dynamicElArr = data.result.map(({ file_name: src }) => ({ src }));
console.log(dynamicElArr);

然后，您可以将其用于dynamicEl.