javascript - 在 Javascript 中填充 JSON 中的动态值

Question

我有一个包含一些值的数组。我需要使用数组元素动态填充值。下面是主阵列。

list = [{name: 'm1'}, {name: 'm2'},{name: 'm3'},{name: 'm4'},{name: 'm5'},]

我有名为 demo.json 的 JSON

demo: {
    listCard = {
        'x': 0,
        'y': 1,
        'name': ''
    },
    layout: [
        {
            'col': '3',
            'row': '3'
            'grids': []
        }
    ]
};

结果应该是——

demo: {
    listCard = {
        'x': 0,
        'y': 1,
        'name': ''
    },
    layout: [
        {
            'col': '3',
            'row': '3'
            'grids': [
                {
                    'x': 0,
                    'y': 1,
                    'name': 'm1'
                },
                {
                    'x': 0,
                    'y': 1,
                    'name': 'm2'
                }
            ]
        },
        {
            'col': '3',
            'row': '3'
            'grids': [
                {
                    'x': 0,
                    'y': 1,
                    'name': 'm3'
                },
                {
                    'x': 0,
                    'y': 1,
                    'name': 'm4'
                }
            ]
        },
        {
            'col': '3',
            'row': '3'
            'grids': [
                {
                    'x': 0,
                    'y': 1,
                    'name': 'm5'
                }
            ]
        }
    ]
};

基本上结果应该像 demo.listcard.name 应该迭代 list.length 次并获取每个值。之后 layout.grid 应该分配给 listcard 的整个对象和 2 个对象。

以下是我使用的方法，但我经常失败。

 let listcard = demo.listcard; //here I get listcard object
 const layout = demo.layout; // layout object

const noOfScreens = (arr, size) => arr.reduce((acc, e, i) => (i % size ? acc[acc.length - 1].push(e) : acc.push([e]), acc), []);
const screens = noOfScreens(list, 2); // master array is split into arrays of size 2.

  for (let i = 0; i < screens.length; i++) {
      layout[0].grids.push(layout);
  }

我被困在这里。请帮帮我

标签： javascriptarraysjsonvue.js

Answer 1

这是你想要的：

const demo = {
    listCard: {
        'x': 0,
        'y': 1,
        'name': ''
    },
    layout: []
};
const list = [{ name: 'm1' }, { name: 'm2' }, { name: 'm3' }, { name: 'm4' }, { name: 'm5' }]

for (var i = 0; i < list.length; i++) {

    if (i % 2 == 0) {
        demo.layout.push({
            'col': '3',
            'row': '3',
            'grids': [{
                'x': 0,
                'y': 1,
                'name': list[i].name
            }]
        })
    } else {
        demo.layout[Math.floor(i / 2)].grids.push({
            'x': 0,
            'y': 1,
            'name': list[i].name
        });
    }


}
console.log(demo);