I have a very basic basic component
testcomponent
<template>
<div class="test">
<h1>testing</h1>
</div>
</template>
Then i have a main component, where i have a button that, when pressed, should open a sweet alert and the content of the alert should be testcomponent
.
I tried this:
<template>
<v-btn @click="showAlert"
outlined
small
tile
style="color: white"
>Open</v-btn>
</template>
<script>
export default {
props:{
},
data() {
},
mounted() {
},
methods: {
showAlert() {
// Use sweetalert2
this.$swal.fire({html: '<testcomponent></testcomponent>'});
},
}
}
</script>
The problem with this code is that the component is not loaded, i see a blank space. Is there any way to do this? Thanks in advance!