main.vue
<template>
<div>
<router-link to="/child" tag="li" activeClass="act">child</router-link>
<router-link to="/child1" tag="li" activeClass="act">child1</router-link>
<router-view></router-view>
</div>
</template>
<script>
import child from './components/child'
import child1 from './components/child1'
export default {
data() {
return {
}
},
methods: {
hello() {
alert('hello');
}
},
components: {child,child1}
}
</script>
<style scoped>
.act {
color: red;
}
</style>
child.vue(child1.vue)
<template>
<div>
我是子組件
<slot></slot>
</div>
</template>
<script>
export default {
}
</script>