SOURCE

var Main = {
  data () {
        return {
        value1: false,
             
              value11: false,
              xWidth:300,
              xHeight:200,
              tablePage: {
                pageSize: 10
              },
              tableProxy: {
                props: {
                  result: 'result',
                  total: 'page.total'
                },
                ajax: {
                  query: () => {
                    return new Promise(resolve => {
                      const list = [
                        { id: 10001, name: 'Test1', role: 'Develop', sex: 'Man', age: 28, address: 'Shenzhen' },
                        { id: 10002, name: 'Test2', role: 'Test', sex: 'Women', age: 22, address: 'Guangzhou' },
                        { id: 10003, name: 'Test3', role: 'PM', sex: 'Man', age: 32, address: 'Shanghai' },
                        { id: 10004, name: 'Test4', role: 'Designer', sex: 'Women', age: 23, address: 'Shenzhen' },
                        { id: 10005, name: 'Test5', role: 'Develop', sex: 'Women', age: 30, address: 'Shanghai' },
                        { id: 10006, name: 'Test6', role: 'Designer', sex: 'Women', age: 21, address: 'Shenzhen' },
                        { id: 10007, name: 'Test7', role: 'Test', sex: 'Man', age: 29, address: 'Shenzhen' },
                        { id: 10008, name: 'Test8', role: 'Develop', sex: 'Man', age: 35, address: 'Shenzhen' }
                      ]
                      resolve({
                        result: list,
                        page: {
                          total: 140
                        }
                      })
                    })
                  }
                }
              },
              tableToolbar: {
                buttons: [
                  { code: 'myBtn1', name: '按钮1' },
                  { code: 'myBtn2', name: '按钮2' }
                ],
                refresh: true,
                custom: true
              },
              tableColumn: [
                { type: 'checkbox', width: 50 },
                { type: 'seq', width: 60 },
                { field: 'name', title: 'Name' },
                { field: 'nickname', title: 'Nickname' },
                {
                  field: 'role',
                  title: 'Role',
                  filters: [
                    { label: '前端', value: '前端' },
                    { label: '后端', value: '后端' },
                    { label: '设计师', value: '设计师' },
                    { label: '管理员', value: '管理员' },
                    { label: '项目经理', value: '项目经理' },
                    { label: '测试', value: '测试' },
                    { label: '美工', value: '美工' },
                    { label: '数据库', value: '数据库' }
                  ]
                },
                { field: 'describe', title: 'Describe' }
              ],
              tableData: [
                { id: 10001, name: 'Test1', role: 'Develop', sex: '0', age: 28, address: 'test abc' },
                { id: 10002, name: 'Test2', role: 'Test', sex: '1', age: 22, address: 'Guangzhou' },
                { id: 10003, name: 'Test3', role: 'PM', sex: '0', age: 32, address: 'Shanghai' },
                { id: 10004, name: 'Test4', role: 'Designer', sex: '1', age: 23, address: 'test abc' },
                { id: 10005, name: 'Test5', role: 'Develop', sex: '1', age: 30, address: 'Shanghai' },
                { id: 10006, name: 'Test6', role: 'Designer', sex: '1', age: 21, address: 'test abc' }
              ]
            }
        }
    ,
    mounted () {
       // this.$refs.PopWindowTest.width=this.xWidth
        //this.$refs.PopWindowTest.height =this.xHeight 
    },
    computed(){
       //this.$refs.PopWindowTest.width=this.xWidth
        //this.$refs.PopWindowTest.height =this.xHeight 
    },
    methods: {
            showEvent()
            {
             //this.$refs.PopWindowTest.width=this.xWidth
              //this.$refs.PopWindowTest.height =this.xHeight 
            },
            testPop(x,y)
            {
                    this.xWidth=x
                    this.xHeigh=y
                    
                  /*  if (xh==1)
                    {
                    document.getElementById("danimic1").style.width ="800px";
                    document.getElementById("danimic1").style.width ="600px";
                    }

                     if (xh==2)
                    {
                    document.getElementById("danimic1").style.width ="400px";
                    document.getElementById("danimic1").style.width ="300px";
                    }*/
                    //this.$refs.PopWindowTest.width=x
                    //this.$refs.PopWindowTest.height=y 
                   // this.myModal6.width =x
                   // this.myModal6.height =y
                    this.value11=true;
                
            }
          }
 
};
var app = new Vue(Main).$mount('#app')

<script src="https://cdn.jsdelivr.net/npm/vue@2">
</script>
<script src="https://cdn.jsdelivr.net/npm/xe-utils">
</script>
<script src="https://cdn.jsdelivr.net/npm/vxe-table@3">
</script>
<!-- 使用 cdn 引用方式需要注意是否锁定版本，默认指向最新版本 -->

<div id="app">
	<template>
		<div>
		 
			<vxe-button @click="testPop(600,400)">场景1</vxe-button>
			<vxe-button @click="testPop(800,600">场景2</vxe-button>
            
 
				<vxe-modal ref='PopWindowTest' v-model="value11" :mask=true id="myModal6" :width="600px" :height=800pxt">
					<template #title>
						<span style="color: red;">动态设置弹窗大小测试</span>
              
            </template>
            <template #default>
              <vxe-grid
                border
                resizable
                show-overflow
                auto-resize
                height="auto"
                :pager-config="tablePage"
                :proxy-config="tableProxy"
                :columns="tableColumn"
                :toolbar-config="tableToolbar"></vxe-grid>
            </template>
          </vxe-modal>
         
    </div>
  </template>
</div>

@import url("https://cdn.jsdelivr.net/npm/vxe-table/lib/style.css");