Vue项目引入文件

Vue项目引入文件Tese01.vue

        <template>
          <div id="app">
            <!-- <img alt="Vue logo" src="./assets/logo.png">
            <HelloWorld msg="Welcome to Your Vue.js App"/> -->
            <!-- 老弟：第一步创建Vue文件 -->
            <Tese01></Tese01>
          </div>
        </template>

        <script>
        // import HelloWorld from './components/HelloWorld.vue'
        //第二步： 引入组件
        import Tese01 from './components/Tese01.vue'
        export default {
          name: 'app',
          components: {
            // HelloWorld
            //第三步：注册组件
            Tese01
          }
        }
        </script>

        <style>
        #app {
          font-family: 'Avenir', Helvetica, Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
          text-align: center;
          color: #2c3e50;
          margin-top: 60px;
        }
        </style>

        <template>
            <div>
                <h1>老马{{a}}</h1>
                <button @click = "add">加一老弟</button>
            </div>
        </template>
        <script>
            export default {
                data() {
                    return {
                        a:10
                    }
                },
                methods:{
                    add() {
                        this.a++
                    }
                }
            }
        </script>

        <style>

        </style>