How to add components dynamically by vue

requirements are as follows: click the addFisrt button to add the content of the first component, click addSecond to dynamically add the content of the second component and can add without limit ~ ask the great gods to provide ideas and methods ~ thank you ~

Feb.28,2021

an fields array
a for loop
several if judgments

fields: [
    {type: 'text', value: ''},
    {type: 'password', value: ''}
]
<div>
    <div v-for="f in fields">
        <input type="password" v-if="f.type === 'password'" v-model="f.value"/>
        <input type="text" v-if="f.type === 'text'" v-model="f.value"/>
    </div>
</div>
Menu