quanyawei
2023-12-15 f74222e571d9164a59e01194f35ff1e34f10a423
src/components/Cascader/regionCity.vue
@@ -1,18 +1,27 @@
<template>
  <div>
    <el-cascader
      ref="myCascader"
      v-model="newRegion"
      placeholder="选择省/市"
      :options="options"
      :size="selectSize"
      clearable
      style="flex:1"
      @change="getvalue"
    />
  </div>
</template>
<script>
export default {
  data() {
  props: {
    selectSize: {
      type: String,
      default: 'medium '
    },
  },
  data () {
    return {
      form: {
        name: '',
@@ -25,15 +34,17 @@
        desc: ''
      },
      options: [],
      newRegion: []
      newRegion: [],
      form1: {}
    }
  },
  watch: {
    newRegion(n, o) {
    newRegion (n, o) {
      console.log(n, o)
      this.$emit('regionCode', n[this.newRegion.length - 1])
    }
  },
  created() {
  created () {
    const runAsync = new Promise((resolve, reject) => {
      this.$request({
        url: '/organization/getMapPath',
@@ -68,7 +79,22 @@
    runAsync.then(() => {
      this.newRegion = [Number(this.$store.state.regionCode.toString().substr(0, 2) + '0000'),
        Number(this.$store.state.regionCode.toString().substr(0, 4) + '00')]
      this.$nextTick(() => {
        this.getvalue()
      })
    })
  },
  methods: {
    getvalue () {
      if (this.newRegion.length > 0) { // 点击清空时,也会触发change事件,避免报错,先判断一下是否有值在来获取选择的节点
        const { label: org, value: orgid } =
          this.$refs.myCascader.getCheckedNodes()[0]
        this.form1 = { org, orgid }
      } else {
        this.form1 = {}
      }
      this.$emit('regionForm', this.form1)
    },
  }
}
</script>
@@ -78,4 +104,3 @@
  text-align: center;
}
</style>