vue2 element 彈出框拖拽會(huì)出現(xiàn)一層陰影問(wèn)題解決方法
更新時(shí)間：2024年01月11日 11:03:39 作者：凌霄玉階非所愿
這篇文章主要介紹了vue2 element 彈出框拖拽會(huì)出現(xiàn)一層陰影問(wèn)題解決方法,因增加 draggable 屬性導(dǎo)致我彈窗表單清空文本框時(shí),從右向左選中字體會(huì)出現(xiàn)拖拽陰影效果,本文給大家介紹vue2 element 彈出框拖拽會(huì)出現(xiàn)一層陰影問(wèn)題解決方法,感興趣的朋友一起看看吧
問(wèn)題如圖所示：
因增加 draggable 屬性導(dǎo)致我彈窗表單清空文本框時(shí)，從右向左選中字體會(huì)出現(xiàn)拖拽陰影效果
去掉 draggable 即可
<template>
<div class="sys-jobTrigger-container">
<el-dialog
:visible.sync="state.isShowDialog"
draggable
:close-on-click-modal="false"
width="900px"
>
<template #header>
<div style="color: #fff;">
<el-icon
size="16"
style="margin-right: 3px; display: inline; vertical-align: middle;"
>
<ele-Edit />
</el-icon>
<span> {{ props.title }} </span>
</div>
</template>
<el-form :model="state.ruleForm" ref="ruleFormRef" label-width="auto">
<el-row :gutter="35">
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
<el-form-item
label="觸發(fā)器編號(hào)"
prop="triggerId"
:rules="[
{
required: true,
message: '觸發(fā)器編號(hào)不能為空',
trigger: 'blur',
},
]"
>
<el-input
v-model="state.ruleForm.triggerId"
placeholder="觸發(fā)器編號(hào)"
clearable
/>
</el-form-item>
</el-col>
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
<el-form-item label="觸發(fā)器類(lèi)型">
<el-select
v-model="state.ruleForm.triggerType"
style="width: 100%;"
>
<el-option
value="Furion.Schedule.PeriodTrigger"
label="間隔"
></el-option>
<el-option
value="Furion.Schedule.CronTrigger"
label="Cron表達(dá)式"
></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col
:xs="24"
:sm="12"
:md="12"
:lg="12"
:xl="12"
class="mb20"到此這篇關(guān)于vue2 element 彈出框拖拽會(huì)出現(xiàn)一層陰影問(wèn)題的文章就介紹到這了,更多相關(guān)vue2 element 彈出框內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
vue-electron使用serialport時(shí)問(wèn)題解決方案
這篇文章主要介紹了vue-electron使用serialport時(shí)問(wèn)題解決方案,本篇文章通過(guò)簡(jiǎn)要的案例,講解了該項(xiàng)技術(shù)的了解與使用,以下就是詳細(xì)內(nèi)容,需要的朋友可以參考下2021-09-09
本篇文章主要介紹了淺談Vue父子組件和非父子組件傳值問(wèn)題，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下。2017-08-08
vue3使用mitt.js實(shí)現(xiàn)各種組件間的通信
在vue工程中,除開(kāi)vue自帶的什么父子間,祖孫間通信,還有一個(gè)非常方便的通信方式,類(lèi)似Vue2.x?使用?EventBus?進(jìn)行組件通信,而?Vue3.x?推薦使用?mitt.js,可以實(shí)現(xiàn)各個(gè)組件間的通信,所以本文給大家介紹了vue3使用mitt.js實(shí)現(xiàn)組件通信,需要的朋友可以參考下2024-05-05
vue 右鍵菜單插件 簡(jiǎn)單、可擴(kuò)展、樣式自定義的右鍵菜單
這篇文章主要介紹了vue 右鍵菜單插件 簡(jiǎn)單、可擴(kuò)展、樣式自定義的右鍵菜單，本文給大家分享個(gè)例子，給大家及時(shí)的非常詳細(xì)，具有一定的參考借鑒價(jià)值 ,需要的朋友可以參考下2018-11-11
vue拖拽組件vuedraggable使用說(shuō)明詳解
這篇文章主要為大家詳細(xì)介紹了vue拖拽組件vuedraggable的使用說(shuō)明，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2022-04-04
vue?目錄樹(shù)的展開(kāi)與關(guān)閉的實(shí)現(xiàn)
Vue作為一款流行的前端框架,提供了一種數(shù)據(jù)驅(qū)動(dòng)的方式來(lái)實(shí)現(xiàn)目錄樹(shù),本文主要介紹了vue?目錄樹(shù)的展開(kāi)與關(guān)閉的實(shí)現(xiàn),具有一定的參考價(jià)值,感興趣的可以了解一下2023-11-11
這篇文章主要為大家詳細(xì)介紹了Vue組件之間的通信，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下，希望能夠給你帶來(lái)幫助2022-02-02
使用Vue3實(shí)現(xiàn)倒計(jì)時(shí)器及倒計(jì)時(shí)任務(wù)的完整代碼
文章介紹了如何使用Vue3和Element-plus開(kāi)發(fā)一個(gè)倒計(jì)時(shí)器和倒計(jì)時(shí)任務(wù)管理界面,倒計(jì)時(shí)器具備手動(dòng)設(shè)置、開(kāi)始、暫停和重啟功能,文章還提供了倒計(jì)時(shí)器的完整代碼,包括HTML、JavaScript和CSS部分,感興趣的朋友一起看看吧2024-11-11
函數(shù)式組件就是函數(shù)是組件,組件是函數(shù),它的特征是沒(méi)有內(nèi)部狀態(tài)、沒(méi)有生命周期鉤子函數(shù)、沒(méi)有this（不需要實(shí)例化的組件）,這篇文章主要給大家介紹了關(guān)于Vue.js函數(shù)式組件的相關(guān)資料,需要的朋友可以參考下2021-10-10
vue+django實(shí)現(xiàn)一對(duì)一聊天功能的實(shí)例代碼
這篇文章主要介紹了vue+django實(shí)現(xiàn)一對(duì)一聊天功能,主要是通過(guò)websocket，由于Django不支持websocket，所以我使用了django-channels。，本文通過(guò)實(shí)例代碼給大家介紹的非常詳細(xì)，需要的朋友可以參考下2019-07-07