有两中心实现的方式
第一种:
通过 <component :is=" "></component> 标签来实现 :is 的值是组件的名称,用一个变量来接收。再通过事件来改变这个变量的值
代码:
<template>
<div class="home">
<!-- <img alt="Vue logo" src="../assets/logo.png" /> -->
<!-- <HelloWorld msg="Welcome to Your Vue.js App" /> -->
<span @click="toggle('login')" >登陆</span> /
<span @click="toggle('reg')">注册</span> /
<span @click="toggle('HelloWorld')">HelloWorld</span>
<component :is="comName"></component>
</div>
</template>
<script>
// @ is an alias to /src
import HelloWorld from "@/components/HelloWorld.vu