父传子；父组件通过：purchaserIdProps=“SDEditlForm.sellerId”，子组件用props接受

 

watch监听（用于回显）

 

@focus=“clickWarehouseId”；input输入框，主要通过foucs事件触发接口

 

if （this.warehouseId） return；判断如果有值，则不触发，防止多次掉接口减少性能消耗

 

disabled: Boolean；：disabled=“disabled”

 

<template>

 

  <!--

 

  value:回显的仓库id 

 

  purchaserIdProps:回显的主体id 

 

  <PgWarehouse v-model="SDEditlForm.warehouseId" :purchaserIdProps="SDEditlForm.sellerId"></PgWarehouse>

 

  -->

 

  <div>

 

    <gdb-select v-model="warehouseId" placeholder="请选择主体" clearable @change="changeWarehouseId" :disabled="disabled" @focus="clickWarehouseId">

 

      <gdb-option v-for="item in warehouseList" :value="item.id" :key="item.id" :label="item.caption"></gdb-option>

 

    </gdb-select>

 

  </div>

 

</template>

 

<script>

 

import '/http/axios'

 

import $http from '/http/http'

 

import Api from '/config/api'

 

export default {

 

  props: {

 

    value: {

 

      type: [String, Number],

 

      default: ''

 

    },

 

    purchaserIdProps: {

 

      type: [String, Number],

 

      default: ''

 

    },

 

    disabled: Boolean

 

  },

 

  data（） {

 

    return {

 

      warehouseId: '',

 

      warehouseList: [],

 

      getWarehouseData: {}

 

    }

 

  },

 

  watch: {

 

    value（newVal） {

 

      if （！newVal） {

 

        this.warehouseId = ''

 

        this.$emit（'input', ''）

 

        this.$emit（'select', ''）

 

      } else if （newVal && this.purchaserIdProps） {

 

        if （this.warehouseId） return

 

       // 按主体的仓库回显

 

        this.warehouseId = this.value

 

        this.getWarehouseData.companyId = this.purchaserIdProps

 

        this.getWarehouseList（）

 

      } else {

 

        if （this.warehouseId） return

 

      // 仓库回显

 

        this.warehouseId = this.value

 

        this.getWarehouseList（）

 

      }

 

    }

 

  },

 

  methods: {

 

    getWarehouseList（） {

 

      $http

 

        .get（{

 

          url: Api.getWarehouseList,

 

          data: this.getWarehouseData

 

        }）

 

        .then（res => {

 

          this.warehouseList = res.data.data

 

        }）

 

    },

 

    changeWarehouseId（） {

 

      this.$emit（'input', this.warehouseId）

 

      this.$emit（'select', this.warehouseId）

 

    },

 

    clickWarehouseId（） {

 

      if （this.warehouseId） return

 

      this.getWarehouseList（）

 

    }

 

  },

 

  //生命周期 - 创建完成（访问当前this实例）

 

  created（） {}

 

}

 

</script>

 

<style lang='scss' scoped>

 

</style>