我有這個資料:
example: {
"jd5jasjs71kdskzaslsdfsdfsdfsdf" : {
param1: '',
param2: '',
param3: '',
param4: 'xx',
param5: 'xx',
advancedParams: {
aone: '',
atwo: '',
athree: '',
afour: 'blablabla'
}
},
我有這段代碼運行良好,直到我發現我需要物件中的另一組資料在我創建的表單的后期階段作為表單欄位實作:
if (this.example.hasOwnProperty(this.someKey)) {
for (const [key, value] of Object.entries(this.example[this.someKey])) {
this.newInputs[key] = value;
}
}
someKey newInputs(object) 來自 Data()
我在這里試圖完成的是將欄位劃分為兩個新物件,這些物件稍后將作為表單欄位呈現。
例子:
newInputs: {
param1: '',
param2: '',
param3: '',
param4: 'xx',
param5: 'xx',
}
aParams: {
aone: '',
atwo: '',
athree: '',
afour: 'blablabla'
}
我能夠做到,但不是 100% 好,我能夠將它拆分為兩個物件,但“advancedParams”也作為一個欄位進入了第一個物件(我不希望他成為)
uj5u.com熱心網友回復:
嘗試如下代碼片段:
new Vue({
el: '#demo',
data() {
return {
newInputs: {},
aParams: {},
someKey: 'jd5jasjs71kdskzaslsdfsdfsdfsdf',
example: {
"jd5jasjs71kdskzaslsdfsdfsdfsdf" : {
param1: '',
param2: '',
param3: '',
param4: 'xx',
param5: 'xx',
advancedParams: {
aone: '',
atwo: '',
athree: '',
afour: 'blablabla'
}
}
}
}
},
methods: {
splitData() {
if (this.example.hasOwnProperty(this.someKey)){
for (const [key, value] of Object.entries(this.example[this.someKey])){
if(typeof value !== 'object'){
this.newInputs[key] = value;
} else {
this.aParams = value;
}
}
}
}
},
mounted() {
this.splitData()
}
})
Vue.config.productionTip = false
Vue.config.devtools = false
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<div id="demo">
<p>newInputs = {{ newInputs }}</p>
<p>aParams = {{ aParams }}</p>
</div>
轉載請註明出處,本文鏈接:https://www.uj5u.com/yidong/341631.html
標籤:javascript Vue.js 循环 目的 Vuejs2
上一篇:有沒有辦法在不將狀態和setter函式作為道具傳遞的情況下更新child中的React狀態?
下一篇:php浮點數、物件和精度
