dialog element-ui vue

<template>
    <el-dialog title="事前准备详单" center top="3%" v-dialogDrag :append-to-body="true" :close-on-click-modal="false"
        :close-on-press-escape="false" :visible.sync="dialogIsShow" width="800px" @close="closed"
        class="entis-select-wrap">
        <div class="div_node_root_ticket">
             
        </div>
        <span slot="footer" class="dialog-footer">
            <el-button @click="dialogIsShow = false">取 消</el-button>
            <!-- <el-button type="primary" @click="editOrAdd(2)">修 改</el-button>
            <el-button type="warning" @click="deleteinfo" plain>删 除</el-button> -->
            <el-button type="primary" @click="editOrAdd(1)" >保 存</el-button>
        </span>
    </el-dialog>
</template>

<script>
    import {
    } from '@/api/api';

    export default {
        props: [],
        components: {

        },
        data() {
            return {
                dialogIsShow: false,
                watchStaffDialogIsShow: -1
            }
        },
        watch: {
            watchStaffDialogIsShow: {
                handler() {
                    this.dialogIsShow= true
                },
                
            },
        },
        mounted() {
            
        },
        methods: {
            // 获取数据
            getFromData() {
                this.watchStaffDialogIsShow = Math.random()
            },
            closed() {

            }
        }
    }
</script>


<style lang="scss" scoped>
    .div_node_root_ticket {
        width: 100%;
        height: 280px;
        box-sizing: border-box;
        background-color: rgb(2, 19, 30);
        /*padding-top: 5px;*/
        position: relative;
        padding: 5px;

        .tadiv {
            width: 100%;
            height: calc(100% - 30px);
        }

    }
</style>

标签：vue,5px,watchStaffDialogIsShow,100%,height,width,api,ui,dialog
来源： https://blog.csdn.net/qq_46100747/article/details/122585981