Vue.js 如何通过vue js更改JSON对象的键名
我在使用vue更改JSON对象的键名“User1”和“User2”时遇到一些问题Vue.js 如何通过vue js更改JSON对象的键名,vue.js,v-for,v-model,Vue.js,V For,V Model,我在使用vue更改JSON对象的键名“User1”和“User2”时遇到一些问题 myJSON = {"User1": {"damage": "10000"}, "User2": {"damage": "10000"}} users = ["User1","User2","User3","User4"] 这是循环代码,还有一些注释。事实上,问题是我不能在v-model中使用“key” <div class="mb-3" v-for="(item, key, index) in myJSO
myJSON = {"User1": {"damage": "10000"}, "User2": {"damage": "10000"}}
users = ["User1","User2","User3","User4"]
这是循环代码,还有一些注释。事实上,问题是我不能在v-model中使用“key”
<div class="mb-3" v-for="(item, key, index) in myJSON">
<el-select v-model="key" filterable placeholder="Select"> // This is doesn't work - it's my problem =)
<el-option
v-for="cl in users"
:key="cl"
:label="cl"
:value="cl">
</el-option>
</el-select>
<el-input-number v-model="item.damage"></el-input-number> // It's okey, damage is changing.
</div>
在
中选择用户后,我需要如下smth:
{"User2": {"damage": "10000"}, "User3": {"damage": "10000"}}
或
但是我走的路不对,请帮忙。不确定是否可以用v-model直接更改obj的钥匙,但有一个解决方法
<div id="app">
<ol>
<li v-for="(item, index) in myJSON_format2">
{{item}}
<input v-model="item.damage"/>
<input v-model="item.key"/>
</li>
</ol>
</div>
new Vue({
el: "#app",
data: {
myJSON: {"User1": {"damage": "10000"}, "User2": {"damage": "10000"}},
myJSON_format2: []
},
methods: {
change_myJSON_toFormat2 () {
for (let i in this.myJSON) {
this.myJSON_format2.push({ damage: this.myJSON[i].damage, key: i })
}
}
},
created () {
this.change_myJSON_toFormat2()
}
})
{{item}}
新Vue({
el:“应用程序”,
数据:{
myJSON:{“User1”:{“damage”:“10000”},User2:{“damage”:“10000”},
myJSON_格式2:[]
},
方法:{
更改\u myJSON\u-toFormat2(){
for(让我输入这个.myJSON){
this.myJSON_format2.push({damage:this.myJSON[i].damage,key:i})
}
}
},
创建(){
这个.change\u myJSON\u toFormat2()
}
})
请在这里查看:
- 解决方法:
- 将myjson的ds更改为obj的数组
- 在vue模板中使用v-for循环arr
- 在更改“损坏”键时更改了“用户”键
{"User3333": {"damage": "10000"}, "User312321": {"damage": "10000"}}
<div id="app">
<ol>
<li v-for="(item, index) in myJSON_format2">
{{item}}
<input v-model="item.damage"/>
<input v-model="item.key"/>
</li>
</ol>
</div>
new Vue({
el: "#app",
data: {
myJSON: {"User1": {"damage": "10000"}, "User2": {"damage": "10000"}},
myJSON_format2: []
},
methods: {
change_myJSON_toFormat2 () {
for (let i in this.myJSON) {
this.myJSON_format2.push({ damage: this.myJSON[i].damage, key: i })
}
}
},
created () {
this.change_myJSON_toFormat2()
}
})