組件data必須是函數(day28)

<div id="app">
   <cpn></cpn>
   <cpn></cpn>
  </div>
  <script src="../js/vue.js">
  </script>
  <!-- 模版 -->
  <template id="cpn"> 
    <div>
      <h1>{{title}}</h1>
      <p>正文</p>
    </div>
  </template>
  <script>

    Vue.component('cpn',{  //註冊全局組件
      template: "#cpn",
      data(){
        return {
          title: "標題"
        }
      }
    })
     const app = new Vue({
        el: '#app',
        data: {
          message: 'hello'
        }
     })
  </script>

爲什麼組件的data必須是函數

當創建多個組件實例時,每個組件的data爲函數即時return的新對象

這樣避免多個組件共享一個data對象

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章