Can a vue component be loaded into a string for use with buefy confirm?
I attempted the following approach, but it did not work as expected:
archiveChannelPrompt () {
const archiveChannel = document.createElement('template');
new Vue({
i18n,
router,
render: (h) => h(OArchiveChannel, {
props: {
channel: this.channel,
}
}),
}).$mount(archiveChannel);
this.$buefy.dialog.confirm({
title: 'Archive Channel',
message: archiveChannel.outerHTML,
confirmText: 'Archive',
onConfirm: () => this.$buefy.toast.open('Archived!')
});
}
The message field requires a string input that can include HTML. It appears I need to convert the vue component into a string in JavaScript in order to pass it to buefy.
I initially thought using innerHTML or outerHTML was ineffective because the component is not rendered in the DOM. However, even after mounting the component in the DOM, no output is generated.
How can I solve this issue?