Buefy Modal的默认行为是在外部单击（或按ESC）时关闭。但是，在处理长输入内容时，此行为可能是有害的，因为错误的单击可能会使用户失去所有工作。
在外部单击时（在VueJS / NustJS中），如何防止Buefy Modal关闭？
在下面的示例中，我创建了一个包含模态的自定义组件（卡模态：https : //buefy.org/documentation/modal）。然后在父页面中，使用以下功能打开模式：
methods: {
createNew(type) {
this.$store.commit('SET_MODAL_TYPE', type)
this.$buefy.modal.open({
parent: this,
component: createNewModal,
hasModalCard: true,
customClass: 'custom-class custom-class-2',
trapFocus: true,
})
},
},
更新：
根据公认的答案，解决方案非常简单，只需canCancel: ['x']在调用模式时添加：
methods: {
createNew(type) {
this.$store.commit('SET_MODAL_TYPE', type)
this.$buefy.modal.open({
parent: this,
component: createNewModal,
hasModalCard: true,
trapFocus: true,
canCancel: ['x'],
})
},
},
只需使用can-cancelprop定义可以导致模态关闭的原因：can-cancel="['escape', 'x', 'outside']"
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句