.vue 结构介绍

#一个最简单的.vue  页面

//定义页面结构。div 是必须要有的根节点
<template>
  <div>
      <h1>Vue案例</h1>
       //插值表达式，数据绑定，将data 中的数据在页面上显示出来
       {{course}}
  </div>
</template>


//定义页面脚本
<script>
  export default {
          //定义页面的数据模型
         data(){
              course:'python'
          }
  }
</script>
          

 #数据双向绑定  v-model=""

<input type="text" v-model="course">

#如何方便快速调试代码：

     下载Vue.jsDevtools 工具。打开谷歌浏览器-》点右上方三个点-》更多工具-》扩展程序-》打开开发者模式-》点击 ‘加载以解压的扩展程序’