javascript - vue dynamically adds components

Question

(implemented with VUE) There is a requirement in the project. I would like to ask for your ideas on how to implement it more reasonably. The requirements are as follows: Clicking a "Create" button on a page will create a "Single Choice Question", clicking the "Create Multiple Choice Question" button will create a multiple choice question, that is, which button will be clicked will create what type of question. , the created questions can also be modified, added, deleted, etc.
My idea is to make each question type into a component. When you click Create, put the component of that question type into the parent component, and finally render the parent component. However, if you do this, the modification of each question type, Where should operations such as adding and deleting be written? Is it in the child component or the parent component?
The following is a UI rendering:

Answer 1

Provide two ideas:

1. Maintain an array to represent how many components have been added, and then use v-if to determine which component currently needs to be rendered.

2. Use Render function and functionalize components.