如何从嵌套对象的数组中删除元素? (lodash)
How to remove an element from an array in a nested object? (lodash)
我有一个像
这样的对象
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 个元素
您可以使用 _.remove
或 _.filter
。
请参考这个example
您不需要 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>
);
}
}
您可以使用数组原型方法本身,
如果你想从前面移除
Array.prototype.shift.apply(data.owner.kyc,null)
我有一个像
这样的对象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 个元素
您可以使用 _.remove
或 _.filter
。
请参考这个example
您不需要 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>
);
}
}
您可以使用数组原型方法本身, 如果你想从前面移除
Array.prototype.shift.apply(data.owner.kyc,null)