2

I am new to quasar framework.

I have created one component & used it modal popup. I have followed this

Dialog is opening using below.

methods: {
  openStoreModal(store:Store) {
    this.$q.dialog({
      component: StoreComponent,
      parent: this,
      title: store.name,
      store: store,
    });
  }
}

Html of custom dialog component.

Html

<template>
  <q-dialog
    ref="dialog"
    @hide="onDialogHide"
  >
    <q-card 
      class="q-dialog-plugin"
      style="width: 700px; max-width: 80vw;"
    >

and inside custom dialog component

methods: {
  show() {
    this.$refs.dialog.show();
  },
  hide() {
    this.$refs.dialog.hide();
  },
  onDialogHide() {
    this.$emit('hide');
  },
  onCloseClick() {
    this.hide();
  }
}

I am getting this error on build.

enter image description here

What am i missing here?

Super Kai - Kazuya Ito
  • 22,221
  • 10
  • 124
  • 129
Ankur Akvaliya
  • 2,989
  • 4
  • 28
  • 53

1 Answers1

0

It's hard to tell without seeing more of your code but the error is TS2339 which is generated from the Typescript compiler. I don't think the problem is with quasar-framework.

Please check your interfaces / types as mentioned in this thread: error TS2339: Property 'x' does not exist on type 'Y'

Leslie Alldridge
  • 1,427
  • 1
  • 10
  • 26
  • Issue with `this.$refs.dialog.show()` only. I have given ref to `q-dialog`. I have added html in which ref is given. Modal dialog open & closes fine when running the app. But it's creating issue on build generation. – Ankur Akvaliya Nov 23 '20 at 09:08
  • Yup, when you run a build the compiler looks at your code and in this case it's failing to find a definition for hide and show on an element type. If you have a link to your project I could pull and run locally? – Leslie Alldridge Nov 24 '20 at 17:19