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

[zhanggx]

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.

[s.molinari]

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

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

Scott

[zhanggx]

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?

[zhanggx]

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

[metalsadman]

@zhanggx you should set it in your custom component.

[dobbel]

@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',