下拉居中

shuishen

2022-10-24 23e62db69830868c3989deaf4b4c8c1ae3895018

下拉居中

 src/views/home/index.vue

@@ -2,7 +2,7 @@
 * @Author: shuishen 1109946754@qq.com
 * @Date: 2022-08-18 16:18:17
 * @LastEditors: shuishen 1109946754@qq.com
 * @LastEditTime: 2022-09-29 17:01:32
 * @LastEditTime: 2022-10-24 09:52:38
 * @FilePath: \srs-police-affairs\src\views\home\index.vue
 * @Description: 小区-栋-层-房屋
 * 
@@ -210,7 +210,7 @@
            </div>
        </div>

        <div class="region-select">
        <div ref="RegionSelect" style="left: 0;" class="region-select">
            <map-select
                class="map-select"
                @selectCheck="policeStationSelect"
@@ -473,6 +473,7 @@
            peopletype: 0,
        }
    },

    created () {
        this.carList = carList
        this.phoneList = phoneList
@@ -482,6 +483,7 @@
        this.policeStationOptions = policeStationOptions
        this.housingDate = housingDate
    },

    mounted () {
        this.initEquipmentEcharts()
        this.initEventChangeEcharts()
@@ -499,6 +501,9 @@
        // })

        this.clickChart()

        this.setDomLeft()
        window.addEventListener('resize', this.setDomLeft)
    },
    updated () {

@@ -1395,10 +1400,17 @@
        timeTabClick (type) {
            this.timetype = type
        },

        peopleTabClick (type) {
            this.peopletype = type
        }
        },

        // 修改下拉容器的left
        setDomLeft () {
            const bodyWidth = document.body.clientWidth
            const domWidth = this.$refs.RegionSelect.offsetWidth
            this.$refs.RegionSelect.style.left = (bodyWidth - domWidth) / 2 + 'px'
        }
    },
    watch: {},

@@ -1435,6 +1447,7 @@
        cylinderLayer.remove()
        cylinderLayer = null

        window.removeEventListener('resize', this.setDomLeft)
    },
}
</script>
@@ -1764,7 +1777,6 @@
        display: flex;
        position: absolute;
        top: 20px;
        left: 420px;
        width: 640px;
        height: 36px;