Following the guide, I am trying to integrate a custom component into my dialog. The Dialog shows but no content or the custom component is displayed. Also, the configuration does not seem to work.
Am I missing something here? I followed the documentaion.
import VuejsDialog from 'vuejs-dialog';
import 'vuejs-dialog/dist/vuejs-dialog.min.css';
Vue.use(VuejsDialog);
import CustomView from '@/components/HDSLogin';
const customView = 'my-unique-view-name';
Vue.dialog.registerComponent(customView, CustomView)
Method to trigger the dialog
this.$dialog.alert( {
view: customView, // can be set globally too
html: false,
animation: 'fade',
okText: "123 cdasd",
cancelText: "31 dsad",
backdropClose: true
});
HDSLogin.vue
<template>
<div >
<p>
content bla blad
sa
dsa
d
as
</p>
</div>
</template>
<script>
// import into project
import Vue from 'vue';
import VuejsDialog from 'vuejs-dialog';
import VuejsDialogMixin from 'vuejs-dialog/dist/vuejs-dialog-mixin.min.js'; // only needed in custom components
import 'vuejs-dialog/dist/vuejs-dialog.min.css';
Vue.use(VuejsDialog);
export default {
mixins: [VuejsDialogMixin],
};
</script>
<style scoped="">
button {
width: 100%;
margin-bottom: 10px;
float: none;
}
</style>
Following the guide, I am trying to integrate a custom component into my dialog. The Dialog shows but no content or the custom component is displayed. Also, the configuration does not seem to work.
Am I missing something here? I followed the documentaion.
Method to trigger the dialog
HDSLogin.vue
Blank dialog is displayed: