I am trying to cherry pick some data in an Object that have a string _new appended to it.
Codesandbox: https://codesandbox.io/s/vibrant-bardeen-77so1u?file=/src/components/Lodash.vue:0-353
I have some data like so:
data.json:
[
{
"localSnameID": 18040,
"isoGeoPoliticalEntry_FK": 959368,
"isoLocalShortName_FK": 953,
"shortNameID": 953,
"adminLanguage2Char": "fa",
"adminLanguage3Char": "fas",
"name": "Afghānistān",
"iso6393Char3Code": "fas",
"P_precedingItem_FK": -1,
"entryType": 0
},
{
"localSnameID": 18312,
"isoGeoPoliticalEntry_FK": 959368,
"isoLocalShortName_FK": 977,
"shortNameID": 977,
"P_precedingItem_FK": 4,
"entryType": 2,
"name": "Afghānistān",
"name_new": "AfghānistānXYZ",
"iso6393Char3Code": "pus",
"iso6393Char3Code_new": "eng",
"adminLanguage2Char": "ps",
"adminLanguage2Char_new": "en",
"adminLanguage3Char": "pus",
"adminLanguage3Char_new": "eng"
}
]
Using lodash, I thought I would do something like this:
<template>
<div>{{ newProperties }}</div>
</template>
<script>
import { omitBy } from "lodash";
import data from "../assets/data.json";
export default {
data() {
return {
localShortNames: data,
};
},
computed: {
newProperties() {
return omitBy(this.localShortNames, (v, k) => k.endsWith("_new"));
},
},
};
</script>
The problem is that the entire original array of objects is still being returned. How can I just get an array of objects that contain the _new property? If there is a better lodash method to use for this case, let me know, too!
If I understood you correctly, take a look at following snippet (without lodash):
new Vue({
el: '#demo',
data() {
return {
localShortNames: [
{"localSnameID": 18040, "isoGeoPoliticalEntry_FK": 959368, "isoLocalShortName_FK": 953, "shortNameID": 953, "adminLanguage2Char": "fa", "adminLanguage3Char": "fas", "name": "Afghānistān", "iso6393Char3Code": "fas", "P_precedingItem_FK": -1, "entryType": 0},
{"localSnameID": 18312, "isoGeoPoliticalEntry_FK": 959368, "isoLocalShortName_FK": 977, "shortNameID": 977, "P_precedingItem_FK": 4, "entryType": 2, "name": "Afghānistān", "name_new": "AfghānistānXYZ", "iso6393Char3Code": "pus", "iso6393Char3Code_new": "eng", "adminLanguage2Char": "ps", "adminLanguage2Char_new": "en", "adminLanguage3Char": "pus", "adminLanguage3Char_new": "eng"}
]
}
},
computed: {
newProperties() {
const res = []
this.localShortNames.forEach(v => {
const u = {}
for(const prop in v) {
if(prop.endsWith("_new")) u[prop]= v[prop]
}
if(Object.keys(u).length !== 0) res.push(u)
})
return res
},
},
})<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<div id="demo">
<div>{{ newProperties }}</div>
</div>