Vue.js 如何通过vue js更改JSON对象的键名

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

我在使用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 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
    • 在更改“损坏”键时更改了“用户”键

    为什么标签中有mysql?不清楚您想要达到什么结果。请阅读以下内容:
    {"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()
     }
    })