如何从嵌套对象的数组中删除元素？（lodash）

Question

我有一个像

这样的对象

data: {
    registrationNumber: 'MH1234',
    type: 'xyz',
    driver: {
      user: {
        firstName: 'xyz',
        lastName: 'abc',
        email: 'xyz',
        phone: 1234,
        city: 'random',
        dateOfBirth: new Date(),
        groups: [1]
      }
    },
    owner: {
      user: {
        firstName: 'xyz',
        lastName: 'abc',
        email: 'xyz',
        phone: '1234',
        city: 'random',
        groups: [1, 2]
      },
      kyc: [
        {
          method: 'xyz',
          id: 'abcd'
        },
        {
          method: 'xyz',
          id: 'abcd'
        }
      ]
    }
  }

如何删除路径 data.owner.kyc.0 中的元素？

我试过使用 _.unset() 但它并不理想，因为数组在删除后仍然显示 2 个元素

Answer 1

您可以使用 _.remove 或 _.filter。

请参考这个example

Answer 2

您不需要 lodash 来完成此操作。

使用 .shift() 从数组中删除第一个元素。

let newData = {...data}

newData.owner.kyc.shift()

用.splice()从某个点开始删除元素。

let newData = {...data}

newData.owner.kyc.splice(0, 1)

使用 .filter() 删除不符合指定条件的项目

let newData = {...data}

newData.owner.kyc = newData.owner.kyc.filter((item, index) => {
   return index !== 0
})

由于您使用的是 React，因此您希望将此数据置于组件状态，以便当您实际从数组中删除某些内容时，应用程序会更新以反映新结果。

查看沙盒：https://codesandbox.io/s/mystifying-fog-2yhwd

class App extends React.Component {
  state = {
    data: data
  };

  removeFirstItem = () => {
    const { data } = this.state;

    let newData = { ...data };

    newData.owner.kyc.shift();

    this.setState({
      data: newData
    });
  };

  render() {
    const { data } = this.state;
    return (
      <div>
        <h4>Car Info:</h4>
        <div>
          KYC:
          {data.owner.kyc.map((item, index) => {
            return (
              <div>
                <span>{index + 1}) </span>
                {item.id}
              </div>
            );
          })}
        </div>
        <button onClick={this.removeFirstItem}>Remove first item</button>
      </div>
    );
  }
}

Answer 3

您可以使用数组原型方法本身，如果你想从前面移除

Array.prototype.shift.apply(data.owner.kyc,null)

如何从嵌套对象的数组中删除元素？（lodash）

How to remove an element from an array in a nested object? (lodash)

javascript

arrays

reactjs

underscore.js

lodash

如何从嵌套对象的数组中删除元素？ （lodash）

How to remove an element from an array in a nested object? (lodash)

javascript

arrays

reactjs

underscore.js

lodash

如何从嵌套对象的数组中删除元素？（lodash）