使用ES6 lodash从API映射对象键

Question

我使用Vue 3发送POST数据到我的API。对象看起来像

const externalResults: ref(null)
const resource = ref({
id: null,
name: null,
state: {}
})

在发送数据到API之前，我正在解析resource对象，以避免发送与state属性相关的嵌套对象。所以发送的有效载荷看起来像

{
id: 1,
name: 'Lorem ipsum',
state_id: 14
}

API在丢失/错误数据的情况下返回422

{
"message":"Some fields are wrong.",
"details":{
"state_id":[
"The state_id field is mandatory."
]
}
}

那么问题来了:我如何重命名对象键以删除总是从键的字符串_id

?由于我使用了validate，所以我必须"映射"。返回模型属性名的错误细节。现在我这样做是为了在请求完成后获取详细信息

externalResults.value = e.response.data.details

但是我可能需要像

这样的东西

externalResults.value = e.response.data.details.map(item => { // Something here... })

我想有一个1行解决方案，无论它是否使用ES6或lodash。请注意，state_id只是一个样本，将有许多属性以_id结束，我需要删除。

预期结果为

externalResults: {
"state":[
"The state_id field is mandatory."
]
}

Answer 1

我不知道您允许您的一行程序有多长，但这是我在ECMAScript中提出的，使用Object.entries()和Object.fromEntries()来反汇编和重新组装对象:

const data = {
id: 1,
name: 'Lorem ipsum',
state_id: 14
};
const fn = (x) => Object.fromEntries(Object.entries(x).map(([k, v]) => [k.endsWith('_id') ? k.slice(0, -3) : k, v]));
console.log(fn(data));

您可以使用replace()和regex来缩短它:

const data = {
id: 1,
name: 'Lorem ipsum',
state_id: 14
};
const fn = (x) => Object.fromEntries(Object.entries(x).map(([k, v]) => [k.replace(/_id$/, ''), v]));
console.log(fn(data));

---

如果您使用lodash，您可以使用mapKeys()函数更短:

const data = {
id: 1,
name: 'Lorem ipsum',
state_id: 14
};
const fn = (x) => _.mapKeys(x, (v, k) => k.replace(/_id$/, ''));
console.log(fn(data));

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.21/lodash.min.js"></script>