vue 简单实验自定义组件独立模块

最新推荐文章于 2024-06-23 14:11:03 发布

科学的发展-只不过是读大自然写的代码

最新推荐文章于 2024-06-23 14:11:03 发布

阅读量322

点赞数

分类专栏： vue 文章标签： vue.js 前端 javascript 简单实验

本文链接：https://blog.csdn.net/xie__jin__cheng/article/details/132491179

版权

vue 专栏收录该内容

33 篇文章 0 订阅

订阅专栏

1.概要

2.代码

2.1

const Counter = {
  data() {
    return {
      counter: 0
    }
  },
  template:`
    <div>
  		Counter: {{ counter }}
	</div>`
}

export default Counter

2.2

import Counter from './t2.js'

const app = Vue.createApp({
  components: {
    'component-a': Counter
  }
})

app.mount('#counter')

2.3

<html>
</html>
<script src="https://unpkg.com/vue@next" rel="external nofollow" ></script>
<script type="module" src="./t1.js"></script>
<body>
	<div id="counter">
  		<component-a></component-a>
	</div>
</body>

3.实验结果