如何将输入绑定到 vue.js 中的对象

Question

有没有办法将输入绑定到对象而不是单个变量。

我知道我们可以做到这一点

<input v-model="name">

但以下内容不起作用：

<input v-model="user.name">

这就是我在 Angular 中习惯的方式，有没有办法在 vue.js 中实现这一点？

Answer 1

这在 Vue 中也有效，确保在数据中定义完整的对象，这将使它具有反应性，这是一个有效的 fiddle。

Vue 代码:

var demo = new Vue({
    el: '#demo',
    data: function(){
        return {
        user: {
            name: 'This is working fine'
        }
      };
    }
})

Answer 2

可以直接绑定数据，代码如下：

var demo = new Vue({
    el: "#demo",
    data: {
      user: {
        name: "please enter"
      }
    }
})

<script src="https://unpkg.com/vue/dist/vue.min.js"></script>
<div id="demo">
  <input v-model="user.name">
  <span>{{user.name}}</span>
</div>

如何将输入绑定到 vue.js 中的对象

How can i bind input to object in vue.js

vue.js

vuejs2