我将 DevExtreme 与 Vue.js 结合使用
我正在将 Vuetify UI 组件转换为 DevExtreme UI 组件
我想在页面中添加一个弹窗,但是弹窗不能正常工作。
创建了一个弹出标签,但标签内的内容为空。
我尝试了很多方法,但找不到解决方案。帮帮我
这是标签状态
<div data-app="true" class="v-application--is--ltr theme--light" id="app">
<div class="v-application--wrap"> ...page content... </div>
<!-- popup -->
<div>
<div class="dx-overlay dx-popup dx-widget dx-visibility-change-handler">
<div class="dx-overlay-content dx-popup-nomal" tabindex="0" style="width: 800px; height: 600px;">
<div class="dx-popup-content"></div>
</div>
</div>
</div>
</div>
这是代码
<dx-popup v-model="isOpen" :visible="isOpen" :width="width" :height="height" :show-title="false" :show-close-button="false">
<div ref="dialog" class="u-dialog">
<u-layout height="*">
<u-layout ref="dialogTitle" class="u-dialog-header">
<div class="pa-0 text-right">
<v-btn depressed small icon class="mr-1" color="transparent"
v-if="isFullScreen && fullScreen"
@click="setFullScreen()"
>
<v-icon color="white">fullscreen_exit</v-icon>
</v-btn>
<v-btn depressed small icon class="mr-1" color="transparent"
v-if="!isFullScreen && fullScreen"
@click="setFullScreen()"
>
<v-icon color="white">fullscreen</v-icon>
</v-btn>
<v-btn depressed small icon class="mr-1" color="transparent" @click="closeButtonClick()">
<v-icon color="white">close</v-icon>
</v-btn>
</div>
</u-layout>
<u-layout ref="dialogContent" height="*" class="u-dialog-content">
<component ref="comp" :is="loader" :param="paramData" :code-map="popup.codeMap" @resolve="resolve" @reject="reject"/>
</u-layout>
</u-layout>
</div>
</dx-popup>