Dynamic component <component :is=''></component>

Vuejs has a built-in component component, which can be used to dynamically switch components

// template
<button @click="UseComponent = 'component-two'">切换为ComponentTwo</button>
<button @click="UseComponent = 'component-one'">切换为ComponentOne</button>
<component :is="UseComponent" />
// script
import ComponentOne from '@/xxx'
import ComponentTwo from '@/xxx'
export default {
    
    
	components: {
    
    
		ComponentOne,
		ComponentTwo
	},
	data(){
    
    
		return {
    
    
			UseComponent: 'component-one'
		}
	}
 }
  • Note that is receives a variable, otherwise the dynamic component has no dynamic meaning

Guess you like

Origin blog.csdn.net/weixin_47979372/article/details/123993887