【基本概念】以下代码打印结果为：new Vue({data:{a:1,b:2},created(){console.log(this.a)},mounted(){console.log(this.b)}}) A2,2 B1,2 C2,1 D1,1

答案是 A。

在 Vue 中，`created` 钩子函数会在实例创建完成后立即调用，此时实例中的 `data` 数据已经被初始化，但是模板和虚拟 DOM 并未被创建和挂载，所以此时访问 `this.a` 的值会输出 `1`。

而 `mounted` 钩子函数会在组件挂载到 DOM 上后调用，此时模板已经被解析成了真实的 DOM，所以访问 `this.b` 的值会输出 `2`。

相关问题

new Vue({ data: { a: 'first', b: 'second' }, created: function () { console.log(this.a) }, mounted(){ console.log(this.b) } }) 打印结果

打印结果应该是：

first
second

先打印出了 data 中的 a 属性，后打印出了 data 中的 b 属性。

new Vue({ data() { return { form: {name:''} } }, created() { this.form={ name: '小明', age: '18', gender:'', weight:108 } } })

这段代码创建了一个 Vue 实例，并定义了一个名为“form”的响应式对象。该对象包含一个名为“name”的属性，并将其初始化为空字符串。

在 Vue 实例的 created 钩子函数中，该响应式对象被重新赋值，其中“name”属性的值被设置为“小明”，并添加了其他属性“age”、“gender”和“weight”。

需要注意的是，在 created 钩子函数中重新赋值对象时，Vue 会将其转换为响应式对象，并将其添加到 Vue 实例中。因此，当对象中的属性值发生变化时，相关的组件部分会自动更新。

在此例中，当 Vue 实例被创建时，表单中的“name”属性会被初始化为空字符串。当 created 钩子函数被调用时，表单中的“name”属性会被重新赋值为“小明”，并添加了其他属性。这些属性可以在 Vue 组件中使用，例如：

<template>
  <div>
    <input v-model="form.name" type="text">
    <input v-model="form.age" type="text">
    <input v-model="form.gender" type="text">
    <input v-model="form.weight" type="text">
  </div>
</template>

<script>
  export default {
    data() {
      return {
        form: {
          name: ''
        }
      }
    },
    created() {
      this.form = {
        name: '小明',
        age: '18',
        gender: '',
        weight: 108
      }
    }
  }
</script>

在这个组件中，我们使用了 v-model 指令将表单中的数据绑定到组件的 data 对象中。当表单中的数据发生变化时，组件的 data 对象会自动更新，从而实现了数据的双向绑定。