解决方案和思路

方案1（推荐方案）

css及html实现

1. 实现tab与轮播图的实现相似
2. parent-dom

   position: relative;
   

3. tab-pane

   width: 100%; 
   position: absolute; 
   top: 0;
   left: (index - activeIndex)*100%; 
   

4. 与轮播图不同的地方，可能每个tab页的高度不同，此时需要设置不在可视范围内的tab-pane

   height: 0px;
   overflow: hidden;
   

5. html 布局

   <Form>
       <div class="parent-dom">
           <div class='tab-pane' id='tab-pane1'>
               <Form.Item>
                   ...
                   <span class='has-error'></span>
               </Form.Item>
           </div>
           <div class='tab-pane' id='tab-pane2'>
               <Form.Item>
                   ...
               </Form.Item>
           </div>
           ...
       </div>
   </Form>
   

js处理逻辑

1. 拿到该含所有表单最近一个parent dom
2. parentDom.querySelect('.has-error') 找到错误提示文本的error dom
3. errorDom.closet('.tab-pane') 找到含错误提示的tabPane dom
4. tabPaneDom.getAttribute('id') 得到含错误提示的tabPane dom的id
5. 设置 activeTab = hasErrorTabPaneDomId

方案2（维护成本较高）

1. 通过papping方式存下表单项所在的tab页
2. 得到校验出错时的表单项标识
3. 设置对应active tab