3回答

• 

  Sam

  2018-08-29 13:53:14

  已采纳

  重新发一遍，方便大家阅读
  

  this.book = xxx

  这里的 this 表示Vue实例，this.book表示给Vue实例动态添加了一个book属性，下面举例证明：
  

  created() {
    this.book = {
      a: 1,
      b: 2
    }
    console.log(this)
  }

  

  通过打印Vue实例可以很清楚的看到，this.book会在Vue实例下创建book属性，指向book对象
  
  ---------------------------------------------------------------------------------------------------------------------
  对于这个问题可以再延伸一下：

  
  this.book = xxx 和 将book定义在data中有什么区别？
  从使用角度来看，看不出区别，但是无法通过this.$data.book获取到book，因为book没有定义在data中，下面举例说明：

  export default {
    data() {
      return {
        test: [1, 2, 3]
      }
    },
    created() {
      this.book = {
        a: 1,
        b: 2
      }
      console.log(this.$data)
      console.log('this.$data.test', this.$data.test)
      console.log('this.$data.book', this.$data.book)
    }
  }

  

  从打印结果中可以看出，test可以通过this.$data.test获取，但是book不行，因为this.$data中只包含test对象。当然实际开发过程中，为了简便，我们仍然可以通过this.test获取test的值。

  1 0

  AB_Cie...

  get到了，感谢老师的详细回复啊1

  2018-08-31 13:36:11

  共 1 条回复 >

• 

  Sam

  2018-08-29 10:13:39

  用手机回复的，效果一般，凑合一下：）

  0 0
• 

  Sam

  2018-08-29 10:10:51

  你好，这是一个好的问题
  
  this.book = ...
  
  这里的this表示Vue实例，this.book表示给Vue实例动态添加了一个book属性，下面给一个例子进行证明
  
  created() {
  this.book = {
  a: 1,
  b: 2
  }
  console.log(this)
  }
  
  
  
  通过打印Vue实例完美可以很清楚的看到，在Vue实例下创建了一个book对象
  
  对这个问题再延伸一下：
  
  this.book = ... 和 将book定义在data中有什么区别？
  
  从使用角度来看，看不出区别，但是无法通过this.$data.book获取到book，因为book没有定义在data中，下面举例说明
  
  export default {
  data() {
  return {
  test: [1, 2, 3]
  }
  },
  created() {
  this.book = {
  a: 1,
  b: 2
  }
  console.log(this.$data)
  console.log('this.$data.test', this.$data.test)
  console.log('this.$data.book', this.$data.book)
  }
  }
  
  
  
  从打印结果中可以看出，test可以通过this.$data.test获取，但是book不行，当然实际开发过程中，为了简便，我们仍然会通过this.test获取test的值

  0 0