Vue模块的基本写法和导入

模版AAA.vue

<template>
  <div>
    <h1>AAA~~~</h1>
  </div>
</template>

<script>
export default {
  name: 'AAA',
  data () {
    return {
      msg: 'bbb'
    }
  }
}
</script>

<style scoped>
</style>

调用刚才写的那个模版

<template>
  <div id="app">
    <AAA />
    <!-- <p>{{testString}}</p> -->
    <p v-text="testString"></p>
  </div>
</template>

<script>
import AAA from './components/AAA'

export default {
  name: 'App',
  data () {
    return { testString: AAA.data().msg }
  },
  components: {
    AAA
  }
}

</script>

<style>
</style>
最后编辑于 ：
©著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。

推荐阅读更多精彩内容