js 同一个组件被调用2次，但是setTimeout只执行一次

Question

我的一个父组件，导入了同一个子组件2次(传入的参数不一样，所以子组件的值也不一样)。
初始化的时候，两个子组件都进入下面的this.search()方法，具体到 delay = setTimeout(function () {
这一行。但是
let params = {type: $this.type, supplierService: $this.supplierService, toS: $this.toS}
这一样只有一个组件能进入。这是为什么啊？怎么解决两个子组件都能取查后台？

onChangeHandler (val) {
        debugger
        if (!this.init) {
          this.search()
          return
        }
        let customer = this.selectCustomer(val)
        this.$emit('input', val)
        // console.log('on-change')
        this.$emit('on-change', customer, this.index)
      },
      
      
  search (val) {
    if (this.allOptions && this.init) {
      return
    }
    this.loading = true
    if (delay) {
      clearTimeout(delay)
    }
    let $this = this
    delay = setTimeout(function () {
      let params = {type: $this.type, supplierService: $this.supplierService, toS: $this.toS}
      if (!$this.allOptions && val) {
        params.keyword = val
      }
      if ($this.allOptions) {
        params.pageSize = 9999 // 查询全部数据，用于车队这种多选的场景
      } else {
        params.pageSize = $this.pageSize
      }
      if ($this.foreign === true) {
        params.foreign = 1
      } else if ($this.foreign === false) {
        params.foreign = 0
      }
      MosService.select(params).then(r => {
        $this.loading = false
        if (r.success) {
          $this.customerOptions = r.content.data.value
          $this.init = true
        }
      })
    }, 300)
  },

Answer 1

看你 delay 定义在哪里，两个 setTimeout 共用了一个 delay 吧

Answer 2

没看到你delay定义的地方，应该你是用了省略var的全局变量，就导致组件会实力化两个，但是用的同一个delay，所以后面那个组件会在第一个之后清空掉定时，然后再重新定时

Answer 3

===========================正确答案=================================
如果一个组件，会由于来源(属性变化)而要去获取不同的数据源，并且这个组件会被一个父组件引用两次(数据源不同)，那么delay设置成属性而不是全局的