Antd select selector drop-down box follows the scroll bar to scroll through the solution

The selector is as follows ：

After scrolling the scroll bar ：

The original code

 <div class="title"> submission </div>
        <a-form-model-item ref="submitType" prop="submitType" class="select-item">
          <a-select v-model="form.submitType" >
            <a-select-option v-for="item in typeArray" :key="item.id" :value="item.value" >
              {
   { item.name }}
            </a-select-option>
          </a-select>

According to the official documents, there is no problem
I always thought I wrote the positioning problem , As a result, I found the hidden properties of official documents for a long time getPopupContainer,
Use it directly getPopupContainer={triggerNode => triggerNode.parentNode}
So the code changes to

<div class="title"> submission </div>
        <a-form-model-item ref="submitType" prop="submitType" class="select-item">
          <a-select v-model="form.submitType" :getPopupContainer="triggerNode=> triggerNode.parentNode">
            <a-select-option v-for="item in typeArray" :key="item.id" :value="item.value" >
              {
   { item.name }}
            </a-select-option>
          </a-select>

Solve the problem directly .
summary ：
1.select Components ,Cascader Components use ：

Add getPopupContainer attribute , Use it directly getPopupContainer={triggerNode => triggerNode.parentNode}, As shown above ：

2. date 、 Components of time class （DatePicker、TimePicker）

Add getCalendarContainer attribute , As shown below ：

     <a-range-picker @change="changeRangeList" :value="dateRangeListVal" :placeholder="[' Select Start Date ', ' Select deadline ']" :getCalendarContainer="triggerNode=> triggerNode.parentNode" />