vue3如何才能实现动态创建临时组件和数据呢

render() {

    return
        <button onClick={() => {
            const modal = useModal()
            const data = {age: 12, name: '缓存'}

            <Modal visible={modal.visible}>
                <!-- Edit组件修改了data数据无需担心, 每次点击重新创建一份新的 -->
                <Edit data={data}></Edit>
            </Modal>
        }}>点击事件</button>
    }

}

想了很久都不知道怎么实现上面 主要是想考虑在编辑的场景下，每次都重新渲染新的数据和组件，无需每次点击按钮将数据重置，请问大佬吗有好的写法吗