有时候,我们希望在一个vue界面引用另外一个vue界面,这个时候就可以使用vue组件引用了。
首先写写一个vue组件,名字为MyCate
<template>
<div>
<label>cat</label>
<label>cat</label>
<label>cat</label>
<label>cat</label>
<label>cat</label>
<label>cat</label>
</div>
</template>
<script>
export default {
name: 'MyCat'
}
</script>
再引用他的vue界面,增加这个组件的引用
import MyCat from './cat'
export default {
components: {
MyCat
}
}
然后在界面直接引用
标签结构如下:
<my-cat></my-cat>
注意标签变为了小写,且中间多了空格。
效果图如下:
哈哈,。。。。。在一个vue界面引用另外一个界面成功了。