<h2>1. 實(shí)例選項(xiàng)的使用</h2>

var my = new Vue({
  el: 'body',
  template: '<div>{{ fruit }}</div>',
  data: {
    fruit: 'apple'
  }
})

el : vue對象裝載的位置
template: html代碼片段
data: 數(shù)據(jù)

<h2>2. components的使用</h2>

import Vue from 'vue'
import App from 'App.vue'
new Vue({
  el: 'body',
  components: { App }
})

實(shí)例化一個(gè)根組件 Vue ， 通過el掛載到body上。
從App.vue中引入App子組件，App是Vue的子組件，Vue又掛載到body上，所以App就被掛載到了body上。

<h2>3. data的正確打開方式</h2>

data使用時(shí)要避免引用賦值，如這樣：

//不推薦的方法
 data : {
     d : 5,
     b : 8,
     fruit: 'apple'
}

如果一個(gè)組件在項(xiàng)目中被多次引用，在一個(gè)組件中改變data的值，其余組件也會(huì)改變，所以要用function返回?cái)?shù)據(jù)就可避免這種情況。如這樣：

//推薦的方法
 data ()  {
   return {
     d : 5,
     b : 8,
     fruit: 'apple'
    }
}