为了账号安全,请及时绑定邮箱和手机立即绑定

为不同的模型分配相同的值,它们协同工作

为不同的模型分配相同的值,它们协同工作

aluckdog 2022-09-23 09:15:59

我很抱歉,如果有一个不恰当的表达,因为它是谷歌翻译


我想知道解决方案或解决方法


我试图在nuxt + vue + vuetfy环境中实现以下目标


・使用API获取用户信息并在屏幕上显示


・按下编辑按钮时,将显示一个对话框并编辑用户信息


・但是,如果您更改编辑屏幕上的值,则背面的显示也会一起更改。


<v-text-field label="name" readonly :value="userDetail.name"/>


<v-dialog v-model="dialog">

  <v-text-field label="name" v-model="userEdit.name"/>

</v-dialog>

async getUser () {

this.userDetail = API RESPONSE

this.userEdit = API RESPONSE

}

我能够通过使用另一种方法分配值来避免它,但它并不好


async getUser () {

this.userDetail = API RESPONSE

}

async getUser2 () {

this.userEdit = API RESPONSE

}

感谢您的阅读


查看完整描述

1 回答

?
墨色风雨

TA贡献1530条经验 获得超1个赞

您在此处使用 v 绑定指令:。其目的是在变量值更改时更新 DOM。:value="userDetail.name"


您必须在 中创建一个新属性,以保存要在文本字段中显示的旧名称。data


例如:


data() {

  return {

    oldName: ''

    ...

  }

}

async getUser () {

  this.userDetail = API RESPONSE

  this.oldName = this.userDetail.name

}

更改为 。:value="userDetail.name":value="oldName"


查看完整回答
反对 回复 6天前
  • 1 回答
  • 0 关注
  • 9 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信