No More Posting New Topics!

If you have a question or an issue, please start a thread in our Github Discussions Forum.
This forum is closed for new threads/ topics.

Navigation

    Quasar Framework

    • Login
    • Search
    • Categories
    • Recent
    • Tags
    • Popular
    • Users
    • Groups
    • Search

    how to adjust height and width of dialog created by this.$q.dialog()?

    Help
    4
    6
    1004
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • Z
      zhanggx last edited by

      this.$q
      .dialog({
      component: IndexDetail,
      parent: this,
      // props forwarded to component
      // (everything except “component” and “parent” props above):
      text: “something”,
      title: “curve”
      // …more.props…
      })
      .onOk(() => {
      console.log(“OK”);
      })
      .onCancel(() => {
      console.log(“Cancel”);
      })
      .onDismiss(() => {
      console.log(“Called on OK or Cancel”);
      });
      },

      I popup a dialog as above , the dialog contains a vue component which is used to show a curve. but it seems that qdialog is small, how to adust the height and width of this dialog? thanks.

      1 Reply Last reply Reply Quote 0
      • s.molinari
        s.molinari last edited by s.molinari

        Try using the style or class props. This is using the style prop.

        https://codepen.io/smolinari/pen/qBZdKqX?editors=1010

        Scott

        1 Reply Last reply Reply Quote 0
        • Z
          zhanggx last edited by

          thanks for your help, however, i am using the qdialog to invoke a vue custom component . then it seems that the qdialog is not big enough to hold the vue component. this cause the component not show fully. any idea to set size of Qdialog on this case?

          1 Reply Last reply Reply Quote 0
          • Z
            zhanggx last edited by

            I found that the max width for Qdialog is 600px , is it true? how to make it bigger?

            metalsadman dobbel 2 Replies Last reply Reply Quote 0
            • metalsadman
              metalsadman @zhanggx last edited by

              @zhanggx you should set it in your custom component.

              1 Reply Last reply Reply Quote 0
              • dobbel
                dobbel @zhanggx last edited by

                @zhanggx

                U can use !important to overrule the max-width ect

                Now the width is max 800px :

                 style: 'height: 600px; width: 800px !important;  max-width: 800px !important',
                
                1 Reply Last reply Reply Quote 0
                • First post
                  Last post