卡戎 发表于 2019-12-12 11:17:08

JDictSelectTag 组件错位问题修正

JDictSelectTag 字典组件增加getPopupContainer参数,用于解决使用 `a-modal` 或其他带有滚动条的组件时,产生的错位问题。

1、JDictSelectTag props增加getPopupContainer
export default {
    name: "JDictSelectTag",
    props: {
      dictCode: String,
      placeholder: String,
      triggerChange: Boolean,
      getPopupContainer: {
      type: Function,
      default:() => document.body
      },
      disabled: Boolean,
      value: String,
      type: String
    },



2、a-select 标签设置getPopupContainer
<a-select :getPopupContainer="getPopupContainer" v-else-if="tagType=='select'" :placeholder="placeholder" :disabled="disabled" :value="value" @change="handleInput">
    <!-- <a-select-option value="">请选择</a-select-option> -->
    <a-select-option v-for="(item, key) in dictOptions" :key="key" :value="item.value">
      <span style="display: inline-block;width: 100%" :title=" item.text || item.label ">
      {{ item.text || item.label }}
      </span>
    </a-select-option>
</a-select>

3、组件使用,传入getPopupContainer
<j-dict-select-tag v-decorator="['companyType', validatorRules.companyType]"
                           :triggerChange="true"
                           placeholder="请输入企业类型" :getPopupContainer="node => node.parentNode"
                           dictCode="company_type" />

4、如果有其他更好的方式或者此问题已解决,请指正。

谢谢
页: [1]
查看完整版本: JDictSelectTag 组件错位问题修正