避免在Vue.js中对变量进行数据绑定

Raz*_*nar 3 javascript forms data-binding binding vue.js

我有一个简单的表格要求用户名和密码.这些是我的Vue.js数据

  data: {
    app_images:[
      { app: '../assets/img/logos/logo.png' }
    ],
    json_repository:[],
    user: {
      username: null,
      password: null
    },
    submitted: null
  }
Run Code Online (Sandbox Code Playgroud)

表单中的用户名和密码字段绑定到user.username和user.password.按下登录按钮执行doLogin功能

methods: {
  doLogin: function() {
    this.submitted = this.user;
},
Run Code Online (Sandbox Code Playgroud)

问题是,从这一刻起,表单中的每个编辑也会更改"提交"字段中的值,我想避免这种情况

Cha*_*man 11

您可以创建数据副本以避免此问题.

methods: {
  doLogin: function() {
    this.submitted = Object.assign({}, this.user);
},
Run Code Online (Sandbox Code Playgroud)

现在你的this.submitted并且this.user不再引用同一个对象而改变一个不会改变另一个.