组件模板的简单分离方法

第一种方法:将template代码写入script标签中,类型必须是type="text/x-template"

  <script type="text/x-template" id="cpn">
    <div>
      <h4>模板分离测试</h4>
      <p>此处是内容</p>
    </div>
  </script>

 Vue.component('cpn',{
    template: '#cpn'//此处是id
  })

第二种写法： 直接使用template标签

<!-- 模板分离的第二种写法 -->
<template id="cpn">
  <div>
    <h4>模板分离测试</h4>
    <p>此处是内容</p>
  </div>
</template>