diff --git a/src/avatar/__test__/__virtualHostSnapshot__/index.test.js.snap b/src/avatar/__test__/__virtualHostSnapshot__/index.test.js.snap
index c292c83f6..5cd6176dc 100644
--- a/src/avatar/__test__/__virtualHostSnapshot__/index.test.js.snap
+++ b/src/avatar/__test__/__virtualHostSnapshot__/index.test.js.snap
@@ -2,45 +2,35 @@
 
 exports[`Avatar & Avatar Groups Avatar Props : style && customStyle 1`] = `
 <main>
-  <main
-    class="avatar"
+  <wx-view
+    class="t-avatar__wrapper class t-class"
+    style="color: red; font-size: 9px;"
   >
     <wx-view
-      class="t-avatar__wrapper class t-class"
-      style="color: red; font-size: 9px;"
+      ariaDescribedby="t_badge_0_description"
+      ariaLabelledby="t_badge_0_label"
+      ariaRole="option"
+      class="t-badge  class t-class"
+      style=""
     >
-      <t-badge
-        tClass=""
-        tClassContent=""
-        tClassCount=""
+      <wx-view
+        ariaHidden="true"
+        class="t-badge__content t-class-content"
+        id="t_badge_0_label"
       >
         <wx-view
-          ariaDescribedby="t_badge_0_description"
-          ariaLabelledby="t_badge_0_label"
-          ariaRole="option"
-          class="t-badge  class t-class"
+          ariaHidden="{{false}}"
+          ariaLabel="头像"
+          ariaRole="img"
+          class="t-avatar t-avatar--circle  t-avatar--medium t-class-image"
           style=""
         >
           <wx-view
-            ariaHidden="true"
-            class="t-badge__content t-class-content"
-            id="t_badge_0_label"
-          >
-            <wx-view
-              ariaHidden="{{false}}"
-              ariaLabel="头像"
-              ariaRole="img"
-              class="t-avatar t-avatar--circle  t-avatar--medium t-class-image"
-              style=""
-            >
-              <wx-view
-                class="t-avatar__text t-class-content"
-              />
-            </wx-view>
-          </wx-view>
+            class="t-avatar__text t-class-content"
+          />
         </wx-view>
-      </t-badge>
+      </wx-view>
     </wx-view>
-  </main>
+  </wx-view>
 </main>
 `;
diff --git a/src/calendar/__test__/__virtualHostSnapshot__/index.test.js.snap b/src/calendar/__test__/__virtualHostSnapshot__/index.test.js.snap
index f3c429447..5e9f6aaf6 100644
--- a/src/calendar/__test__/__virtualHostSnapshot__/index.test.js.snap
+++ b/src/calendar/__test__/__virtualHostSnapshot__/index.test.js.snap
@@ -2,808 +2,777 @@
 
 exports[`calendar :base 1`] = `
 <main>
-  <t-calendar>
-    <t-popup
-      class="class"
-      bind:visible-change="onVisibleChange"
+  <wx-view
+    ariaModal="{{true}}"
+    ariaRole="dialog"
+    class="t-popup t-popup--bottom t-fade-enter t-fade-enter-active class t-class"
+    style="z-index:11500;"
+    bind:transitionend="onTransitionEnd"
+  >
+    <wx-view
+      class="t-popup__content t-class-content"
     >
       <wx-view
-        ariaModal="{{true}}"
-        ariaRole="dialog"
-        class="t-popup t-popup--bottom t-fade-enter t-fade-enter-active class t-class"
-        style="z-index:11500;"
-        bind:transitionend="onTransitionEnd"
+        class="t-calendar t-calendar--popup class t-class"
+        style=""
       >
         <wx-view
-          class="t-popup__content t-class-content"
+          class="t-calendar__title"
+          tabindex="0"
+        >
+          <wx-text>
+            请选择日期
+          </wx-text>
+        </wx-view>
+        <wx-view
+          ariaHidden="{{false}}"
+          ariaLabel="关闭"
+          ariaRole="button"
+          class="t-icon class t-class"
+          style="font-size: 24px;"
+          bind:tap="onTap"
+        >
+          <wx-label
+            class="t-icon-close t-icon-base"
+          />
+        </wx-view>
+        <wx-view
+          ariaHidden="{{true}}"
+          class="t-calendar__days"
         >
           <wx-view
-            class="t-calendar t-calendar--popup class t-class"
-            style=""
+            class="t-calendar__days-item"
+          >
+            日
+          </wx-view>
+          <wx-view
+            class="t-calendar__days-item"
+          >
+            一
+          </wx-view>
+          <wx-view
+            class="t-calendar__days-item"
+          >
+            二
+          </wx-view>
+          <wx-view
+            class="t-calendar__days-item"
+          >
+            三
+          </wx-view>
+          <wx-view
+            class="t-calendar__days-item"
+          >
+            四
+          </wx-view>
+          <wx-view
+            class="t-calendar__days-item"
+          >
+            五
+          </wx-view>
+          <wx-view
+            class="t-calendar__days-item"
+          >
+            六
+          </wx-view>
+        </wx-view>
+        <wx-scroll-view
+          class="t-calendar__months"
+          enhanced="{{true}}"
+          scrollIntoView="year_2022_month_9"
+          scrollY="{{true}}"
+          showScrollbar="{{false}}"
+        >
+          <wx-view
+            class="t-calendar__month"
+            id="year_2022_month_9"
+          >
+            2022 年 10 月
+          </wx-view>
+          <wx-view
+            class="t-calendar__dates"
           >
+            <wx-view />
+            <wx-view />
+            <wx-view />
+            <wx-view />
+            <wx-view />
+            <wx-view />
             <wx-view
-              class="t-calendar__title"
-              tabindex="0"
-            >
-              <wx-text>
-                请选择日期
-              </wx-text>
-            </wx-view>
-            <t-icon
-              class="t-calendar__close-btn"
-              bind:tap="handleClose"
-            >
-              <wx-view
-                ariaHidden="{{false}}"
-                ariaLabel="关闭"
-                ariaRole="button"
-                class="t-icon class t-class"
-                style="font-size: 24px;"
-                bind:tap="onTap"
-              >
-                <wx-label
-                  class="t-icon-close t-icon-base"
-                />
-              </wx-view>
-            </t-icon>
-            <wx-view
-              ariaHidden="{{true}}"
-              class="t-calendar__days"
-            >
-              <wx-view
-                class="t-calendar__days-item"
-              >
-                日
-              </wx-view>
-              <wx-view
-                class="t-calendar__days-item"
-              >
-                一
-              </wx-view>
-              <wx-view
-                class="t-calendar__days-item"
-              >
-                二
-              </wx-view>
-              <wx-view
-                class="t-calendar__days-item"
-              >
-                三
-              </wx-view>
-              <wx-view
-                class="t-calendar__days-item"
-              >
-                四
-              </wx-view>
-              <wx-view
-                class="t-calendar__days-item"
-              >
-                五
-              </wx-view>
-              <wx-view
-                class="t-calendar__days-item"
-              >
-                六
-              </wx-view>
-            </wx-view>
-            <wx-scroll-view
-              class="t-calendar__months"
-              enhanced="{{true}}"
-              scrollIntoView="year_2022_month_9"
-              scrollY="{{true}}"
-              showScrollbar="{{false}}"
-            >
-              <wx-view
-                class="t-calendar__month"
-                id="year_2022_month_9"
-              >
-                2022 年 10 月
-              </wx-view>
-              <wx-view
-                class="t-calendar__dates"
-              >
-                <wx-view />
-                <wx-view />
-                <wx-view />
-                <wx-view />
-                <wx-view />
-                <wx-view />
-                <wx-view
-                  ariaDisabled="{{false}}"
-                  ariaLabel="10月1日, 星期六"
-                  ariaRole="button"
-                  class="t-calendar__dates-item  t-calendar__dates-item--"
-                  data-date="{{
-                    Object {
-                      "date": Object {},
-                      "day": 1,
-                      "type": "",
-                    }
-                  }}"
-                  data-month="{{9}}"
-                  data-year="{{2022}}"
-                  bind:tap="handleSelect"
-                >
-                  
+              ariaDisabled="{{false}}"
+              ariaLabel="10月1日, 星期六"
+              ariaRole="button"
+              class="t-calendar__dates-item  t-calendar__dates-item--"
+              data-date="{{
+                Object {
+                  "date": Object {},
+                  "day": 1,
+                  "type": "",
+                }
+              }}"
+              data-month="{{9}}"
+              data-year="{{2022}}"
+              bind:tap="handleSelect"
+            >
+              
             1
             
-                </wx-view>
-                <wx-view
-                  ariaDisabled="{{false}}"
-                  ariaLabel="10月2日, 星期日"
-                  ariaRole="button"
-                  class="t-calendar__dates-item  t-calendar__dates-item--"
-                  data-date="{{
-                    Object {
-                      "date": Object {},
-                      "day": 2,
-                      "type": "",
-                    }
-                  }}"
-                  data-month="{{9}}"
-                  data-year="{{2022}}"
-                  bind:tap="handleSelect"
-                >
-                  
+            </wx-view>
+            <wx-view
+              ariaDisabled="{{false}}"
+              ariaLabel="10月2日, 星期日"
+              ariaRole="button"
+              class="t-calendar__dates-item  t-calendar__dates-item--"
+              data-date="{{
+                Object {
+                  "date": Object {},
+                  "day": 2,
+                  "type": "",
+                }
+              }}"
+              data-month="{{9}}"
+              data-year="{{2022}}"
+              bind:tap="handleSelect"
+            >
+              
             2
             
-                </wx-view>
-                <wx-view
-                  ariaDisabled="{{false}}"
-                  ariaLabel="10月3日, 星期一"
-                  ariaRole="button"
-                  class="t-calendar__dates-item  t-calendar__dates-item--"
-                  data-date="{{
-                    Object {
-                      "date": Object {},
-                      "day": 3,
-                      "type": "",
-                    }
-                  }}"
-                  data-month="{{9}}"
-                  data-year="{{2022}}"
-                  bind:tap="handleSelect"
-                >
-                  
+            </wx-view>
+            <wx-view
+              ariaDisabled="{{false}}"
+              ariaLabel="10月3日, 星期一"
+              ariaRole="button"
+              class="t-calendar__dates-item  t-calendar__dates-item--"
+              data-date="{{
+                Object {
+                  "date": Object {},
+                  "day": 3,
+                  "type": "",
+                }
+              }}"
+              data-month="{{9}}"
+              data-year="{{2022}}"
+              bind:tap="handleSelect"
+            >
+              
             3
             
-                </wx-view>
-                <wx-view
-                  ariaDisabled="{{false}}"
-                  ariaLabel="10月4日, 星期二"
-                  ariaRole="button"
-                  class="t-calendar__dates-item  t-calendar__dates-item--"
-                  data-date="{{
-                    Object {
-                      "date": Object {},
-                      "day": 4,
-                      "type": "",
-                    }
-                  }}"
-                  data-month="{{9}}"
-                  data-year="{{2022}}"
-                  bind:tap="handleSelect"
-                >
-                  
+            </wx-view>
+            <wx-view
+              ariaDisabled="{{false}}"
+              ariaLabel="10月4日, 星期二"
+              ariaRole="button"
+              class="t-calendar__dates-item  t-calendar__dates-item--"
+              data-date="{{
+                Object {
+                  "date": Object {},
+                  "day": 4,
+                  "type": "",
+                }
+              }}"
+              data-month="{{9}}"
+              data-year="{{2022}}"
+              bind:tap="handleSelect"
+            >
+              
             4
             
-                </wx-view>
-                <wx-view
-                  ariaDisabled="{{false}}"
-                  ariaLabel="10月5日, 星期三"
-                  ariaRole="button"
-                  class="t-calendar__dates-item  t-calendar__dates-item--"
-                  data-date="{{
-                    Object {
-                      "date": Object {},
-                      "day": 5,
-                      "type": "",
-                    }
-                  }}"
-                  data-month="{{9}}"
-                  data-year="{{2022}}"
-                  bind:tap="handleSelect"
-                >
-                  
+            </wx-view>
+            <wx-view
+              ariaDisabled="{{false}}"
+              ariaLabel="10月5日, 星期三"
+              ariaRole="button"
+              class="t-calendar__dates-item  t-calendar__dates-item--"
+              data-date="{{
+                Object {
+                  "date": Object {},
+                  "day": 5,
+                  "type": "",
+                }
+              }}"
+              data-month="{{9}}"
+              data-year="{{2022}}"
+              bind:tap="handleSelect"
+            >
+              
             5
             
-                </wx-view>
-                <wx-view
-                  ariaDisabled="{{false}}"
-                  ariaLabel="10月6日, 星期四"
-                  ariaRole="button"
-                  class="t-calendar__dates-item  t-calendar__dates-item--"
-                  data-date="{{
-                    Object {
-                      "date": Object {},
-                      "day": 6,
-                      "type": "",
-                    }
-                  }}"
-                  data-month="{{9}}"
-                  data-year="{{2022}}"
-                  bind:tap="handleSelect"
-                >
-                  
+            </wx-view>
+            <wx-view
+              ariaDisabled="{{false}}"
+              ariaLabel="10月6日, 星期四"
+              ariaRole="button"
+              class="t-calendar__dates-item  t-calendar__dates-item--"
+              data-date="{{
+                Object {
+                  "date": Object {},
+                  "day": 6,
+                  "type": "",
+                }
+              }}"
+              data-month="{{9}}"
+              data-year="{{2022}}"
+              bind:tap="handleSelect"
+            >
+              
             6
             
-                </wx-view>
-                <wx-view
-                  ariaDisabled="{{false}}"
-                  ariaLabel="10月7日, 星期五"
-                  ariaRole="button"
-                  class="t-calendar__dates-item  t-calendar__dates-item--"
-                  data-date="{{
-                    Object {
-                      "date": Object {},
-                      "day": 7,
-                      "type": "",
-                    }
-                  }}"
-                  data-month="{{9}}"
-                  data-year="{{2022}}"
-                  bind:tap="handleSelect"
-                >
-                  
+            </wx-view>
+            <wx-view
+              ariaDisabled="{{false}}"
+              ariaLabel="10月7日, 星期五"
+              ariaRole="button"
+              class="t-calendar__dates-item  t-calendar__dates-item--"
+              data-date="{{
+                Object {
+                  "date": Object {},
+                  "day": 7,
+                  "type": "",
+                }
+              }}"
+              data-month="{{9}}"
+              data-year="{{2022}}"
+              bind:tap="handleSelect"
+            >
+              
             7
             
-                </wx-view>
-                <wx-view
-                  ariaDisabled="{{false}}"
-                  ariaLabel="10月8日, 星期六"
-                  ariaRole="button"
-                  class="t-calendar__dates-item  t-calendar__dates-item--"
-                  data-date="{{
-                    Object {
-                      "date": Object {},
-                      "day": 8,
-                      "type": "",
-                    }
-                  }}"
-                  data-month="{{9}}"
-                  data-year="{{2022}}"
-                  bind:tap="handleSelect"
-                >
-                  
+            </wx-view>
+            <wx-view
+              ariaDisabled="{{false}}"
+              ariaLabel="10月8日, 星期六"
+              ariaRole="button"
+              class="t-calendar__dates-item  t-calendar__dates-item--"
+              data-date="{{
+                Object {
+                  "date": Object {},
+                  "day": 8,
+                  "type": "",
+                }
+              }}"
+              data-month="{{9}}"
+              data-year="{{2022}}"
+              bind:tap="handleSelect"
+            >
+              
             8
             
-                </wx-view>
-                <wx-view
-                  ariaDisabled="{{false}}"
-                  ariaLabel="10月9日, 星期日"
-                  ariaRole="button"
-                  class="t-calendar__dates-item  t-calendar__dates-item--"
-                  data-date="{{
-                    Object {
-                      "date": Object {},
-                      "day": 9,
-                      "type": "",
-                    }
-                  }}"
-                  data-month="{{9}}"
-                  data-year="{{2022}}"
-                  bind:tap="handleSelect"
-                >
-                  
+            </wx-view>
+            <wx-view
+              ariaDisabled="{{false}}"
+              ariaLabel="10月9日, 星期日"
+              ariaRole="button"
+              class="t-calendar__dates-item  t-calendar__dates-item--"
+              data-date="{{
+                Object {
+                  "date": Object {},
+                  "day": 9,
+                  "type": "",
+                }
+              }}"
+              data-month="{{9}}"
+              data-year="{{2022}}"
+              bind:tap="handleSelect"
+            >
+              
             9
             
-                </wx-view>
-                <wx-view
-                  ariaDisabled="{{false}}"
-                  ariaLabel="10月10日, 星期一"
-                  ariaRole="button"
-                  class="t-calendar__dates-item  t-calendar__dates-item--"
-                  data-date="{{
-                    Object {
-                      "date": Object {},
-                      "day": 10,
-                      "type": "",
-                    }
-                  }}"
-                  data-month="{{9}}"
-                  data-year="{{2022}}"
-                  bind:tap="handleSelect"
-                >
-                  
+            </wx-view>
+            <wx-view
+              ariaDisabled="{{false}}"
+              ariaLabel="10月10日, 星期一"
+              ariaRole="button"
+              class="t-calendar__dates-item  t-calendar__dates-item--"
+              data-date="{{
+                Object {
+                  "date": Object {},
+                  "day": 10,
+                  "type": "",
+                }
+              }}"
+              data-month="{{9}}"
+              data-year="{{2022}}"
+              bind:tap="handleSelect"
+            >
+              
             10
             
-                </wx-view>
-                <wx-view
-                  ariaDisabled="{{false}}"
-                  ariaLabel="10月11日, 星期二"
-                  ariaRole="button"
-                  class="t-calendar__dates-item  t-calendar__dates-item--"
-                  data-date="{{
-                    Object {
-                      "date": Object {},
-                      "day": 11,
-                      "type": "",
-                    }
-                  }}"
-                  data-month="{{9}}"
-                  data-year="{{2022}}"
-                  bind:tap="handleSelect"
-                >
-                  
+            </wx-view>
+            <wx-view
+              ariaDisabled="{{false}}"
+              ariaLabel="10月11日, 星期二"
+              ariaRole="button"
+              class="t-calendar__dates-item  t-calendar__dates-item--"
+              data-date="{{
+                Object {
+                  "date": Object {},
+                  "day": 11,
+                  "type": "",
+                }
+              }}"
+              data-month="{{9}}"
+              data-year="{{2022}}"
+              bind:tap="handleSelect"
+            >
+              
             11
             
-                </wx-view>
-                <wx-view
-                  ariaDisabled="{{false}}"
-                  ariaLabel="10月12日, 星期三"
-                  ariaRole="button"
-                  class="t-calendar__dates-item  t-calendar__dates-item--"
-                  data-date="{{
-                    Object {
-                      "date": Object {},
-                      "day": 12,
-                      "type": "",
-                    }
-                  }}"
-                  data-month="{{9}}"
-                  data-year="{{2022}}"
-                  bind:tap="handleSelect"
-                >
-                  
+            </wx-view>
+            <wx-view
+              ariaDisabled="{{false}}"
+              ariaLabel="10月12日, 星期三"
+              ariaRole="button"
+              class="t-calendar__dates-item  t-calendar__dates-item--"
+              data-date="{{
+                Object {
+                  "date": Object {},
+                  "day": 12,
+                  "type": "",
+                }
+              }}"
+              data-month="{{9}}"
+              data-year="{{2022}}"
+              bind:tap="handleSelect"
+            >
+              
             12
             
-                </wx-view>
-                <wx-view
-                  ariaDisabled="{{false}}"
-                  ariaLabel="10月13日, 星期四"
-                  ariaRole="button"
-                  class="t-calendar__dates-item  t-calendar__dates-item--"
-                  data-date="{{
-                    Object {
-                      "date": Object {},
-                      "day": 13,
-                      "type": "",
-                    }
-                  }}"
-                  data-month="{{9}}"
-                  data-year="{{2022}}"
-                  bind:tap="handleSelect"
-                >
-                  
+            </wx-view>
+            <wx-view
+              ariaDisabled="{{false}}"
+              ariaLabel="10月13日, 星期四"
+              ariaRole="button"
+              class="t-calendar__dates-item  t-calendar__dates-item--"
+              data-date="{{
+                Object {
+                  "date": Object {},
+                  "day": 13,
+                  "type": "",
+                }
+              }}"
+              data-month="{{9}}"
+              data-year="{{2022}}"
+              bind:tap="handleSelect"
+            >
+              
             13
             
-                </wx-view>
-                <wx-view
-                  ariaDisabled="{{false}}"
-                  ariaLabel="10月14日, 星期五"
-                  ariaRole="button"
-                  class="t-calendar__dates-item  t-calendar__dates-item--"
-                  data-date="{{
-                    Object {
-                      "date": Object {},
-                      "day": 14,
-                      "type": "",
-                    }
-                  }}"
-                  data-month="{{9}}"
-                  data-year="{{2022}}"
-                  bind:tap="handleSelect"
-                >
-                  
+            </wx-view>
+            <wx-view
+              ariaDisabled="{{false}}"
+              ariaLabel="10月14日, 星期五"
+              ariaRole="button"
+              class="t-calendar__dates-item  t-calendar__dates-item--"
+              data-date="{{
+                Object {
+                  "date": Object {},
+                  "day": 14,
+                  "type": "",
+                }
+              }}"
+              data-month="{{9}}"
+              data-year="{{2022}}"
+              bind:tap="handleSelect"
+            >
+              
             14
             
-                </wx-view>
-                <wx-view
-                  ariaDisabled="{{false}}"
-                  ariaLabel="10月15日, 星期六"
-                  ariaRole="button"
-                  class="t-calendar__dates-item  t-calendar__dates-item--"
-                  data-date="{{
-                    Object {
-                      "date": Object {},
-                      "day": 15,
-                      "type": "",
-                    }
-                  }}"
-                  data-month="{{9}}"
-                  data-year="{{2022}}"
-                  bind:tap="handleSelect"
-                >
-                  
+            </wx-view>
+            <wx-view
+              ariaDisabled="{{false}}"
+              ariaLabel="10月15日, 星期六"
+              ariaRole="button"
+              class="t-calendar__dates-item  t-calendar__dates-item--"
+              data-date="{{
+                Object {
+                  "date": Object {},
+                  "day": 15,
+                  "type": "",
+                }
+              }}"
+              data-month="{{9}}"
+              data-year="{{2022}}"
+              bind:tap="handleSelect"
+            >
+              
             15
             
-                </wx-view>
-                <wx-view
-                  ariaDisabled="{{false}}"
-                  ariaLabel="已选中, 10月16日, 星期日"
-                  ariaRole="button"
-                  class="t-calendar__dates-item  t-calendar__dates-item--selected"
-                  data-date="{{
-                    Object {
-                      "date": Object {},
-                      "day": 16,
-                      "type": "selected",
-                    }
-                  }}"
-                  data-month="{{9}}"
-                  data-year="{{2022}}"
-                  bind:tap="handleSelect"
-                >
-                  
+            </wx-view>
+            <wx-view
+              ariaDisabled="{{false}}"
+              ariaLabel="已选中, 10月16日, 星期日"
+              ariaRole="button"
+              class="t-calendar__dates-item  t-calendar__dates-item--selected"
+              data-date="{{
+                Object {
+                  "date": Object {},
+                  "day": 16,
+                  "type": "selected",
+                }
+              }}"
+              data-month="{{9}}"
+              data-year="{{2022}}"
+              bind:tap="handleSelect"
+            >
+              
             16
             
-                </wx-view>
-                <wx-view
-                  ariaDisabled="{{false}}"
-                  ariaLabel="10月17日, 星期一"
-                  ariaRole="button"
-                  class="t-calendar__dates-item  t-calendar__dates-item--"
-                  data-date="{{
-                    Object {
-                      "date": Object {},
-                      "day": 17,
-                      "type": "",
-                    }
-                  }}"
-                  data-month="{{9}}"
-                  data-year="{{2022}}"
-                  bind:tap="handleSelect"
-                >
-                  
+            </wx-view>
+            <wx-view
+              ariaDisabled="{{false}}"
+              ariaLabel="10月17日, 星期一"
+              ariaRole="button"
+              class="t-calendar__dates-item  t-calendar__dates-item--"
+              data-date="{{
+                Object {
+                  "date": Object {},
+                  "day": 17,
+                  "type": "",
+                }
+              }}"
+              data-month="{{9}}"
+              data-year="{{2022}}"
+              bind:tap="handleSelect"
+            >
+              
             17
             
-                </wx-view>
-                <wx-view
-                  ariaDisabled="{{false}}"
-                  ariaLabel="10月18日, 星期二"
-                  ariaRole="button"
-                  class="t-calendar__dates-item  t-calendar__dates-item--"
-                  data-date="{{
-                    Object {
-                      "date": Object {},
-                      "day": 18,
-                      "type": "",
-                    }
-                  }}"
-                  data-month="{{9}}"
-                  data-year="{{2022}}"
-                  bind:tap="handleSelect"
-                >
-                  
+            </wx-view>
+            <wx-view
+              ariaDisabled="{{false}}"
+              ariaLabel="10月18日, 星期二"
+              ariaRole="button"
+              class="t-calendar__dates-item  t-calendar__dates-item--"
+              data-date="{{
+                Object {
+                  "date": Object {},
+                  "day": 18,
+                  "type": "",
+                }
+              }}"
+              data-month="{{9}}"
+              data-year="{{2022}}"
+              bind:tap="handleSelect"
+            >
+              
             18
             
-                </wx-view>
-                <wx-view
-                  ariaDisabled="{{false}}"
-                  ariaLabel="10月19日, 星期三"
-                  ariaRole="button"
-                  class="t-calendar__dates-item  t-calendar__dates-item--"
-                  data-date="{{
-                    Object {
-                      "date": Object {},
-                      "day": 19,
-                      "type": "",
-                    }
-                  }}"
-                  data-month="{{9}}"
-                  data-year="{{2022}}"
-                  bind:tap="handleSelect"
-                >
-                  
+            </wx-view>
+            <wx-view
+              ariaDisabled="{{false}}"
+              ariaLabel="10月19日, 星期三"
+              ariaRole="button"
+              class="t-calendar__dates-item  t-calendar__dates-item--"
+              data-date="{{
+                Object {
+                  "date": Object {},
+                  "day": 19,
+                  "type": "",
+                }
+              }}"
+              data-month="{{9}}"
+              data-year="{{2022}}"
+              bind:tap="handleSelect"
+            >
+              
             19
             
-                </wx-view>
-                <wx-view
-                  ariaDisabled="{{false}}"
-                  ariaLabel="10月20日, 星期四"
-                  ariaRole="button"
-                  class="t-calendar__dates-item  t-calendar__dates-item--"
-                  data-date="{{
-                    Object {
-                      "date": Object {},
-                      "day": 20,
-                      "type": "",
-                    }
-                  }}"
-                  data-month="{{9}}"
-                  data-year="{{2022}}"
-                  bind:tap="handleSelect"
-                >
-                  
+            </wx-view>
+            <wx-view
+              ariaDisabled="{{false}}"
+              ariaLabel="10月20日, 星期四"
+              ariaRole="button"
+              class="t-calendar__dates-item  t-calendar__dates-item--"
+              data-date="{{
+                Object {
+                  "date": Object {},
+                  "day": 20,
+                  "type": "",
+                }
+              }}"
+              data-month="{{9}}"
+              data-year="{{2022}}"
+              bind:tap="handleSelect"
+            >
+              
             20
             
-                </wx-view>
-                <wx-view
-                  ariaDisabled="{{false}}"
-                  ariaLabel="10月21日, 星期五"
-                  ariaRole="button"
-                  class="t-calendar__dates-item  t-calendar__dates-item--"
-                  data-date="{{
-                    Object {
-                      "date": Object {},
-                      "day": 21,
-                      "type": "",
-                    }
-                  }}"
-                  data-month="{{9}}"
-                  data-year="{{2022}}"
-                  bind:tap="handleSelect"
-                >
-                  
+            </wx-view>
+            <wx-view
+              ariaDisabled="{{false}}"
+              ariaLabel="10月21日, 星期五"
+              ariaRole="button"
+              class="t-calendar__dates-item  t-calendar__dates-item--"
+              data-date="{{
+                Object {
+                  "date": Object {},
+                  "day": 21,
+                  "type": "",
+                }
+              }}"
+              data-month="{{9}}"
+              data-year="{{2022}}"
+              bind:tap="handleSelect"
+            >
+              
             21
             
-                </wx-view>
-                <wx-view
-                  ariaDisabled="{{false}}"
-                  ariaLabel="10月22日, 星期六"
-                  ariaRole="button"
-                  class="t-calendar__dates-item  t-calendar__dates-item--"
-                  data-date="{{
-                    Object {
-                      "date": Object {},
-                      "day": 22,
-                      "type": "",
-                    }
-                  }}"
-                  data-month="{{9}}"
-                  data-year="{{2022}}"
-                  bind:tap="handleSelect"
-                >
-                  
+            </wx-view>
+            <wx-view
+              ariaDisabled="{{false}}"
+              ariaLabel="10月22日, 星期六"
+              ariaRole="button"
+              class="t-calendar__dates-item  t-calendar__dates-item--"
+              data-date="{{
+                Object {
+                  "date": Object {},
+                  "day": 22,
+                  "type": "",
+                }
+              }}"
+              data-month="{{9}}"
+              data-year="{{2022}}"
+              bind:tap="handleSelect"
+            >
+              
             22
             
-                </wx-view>
-                <wx-view
-                  ariaDisabled="{{false}}"
-                  ariaLabel="10月23日, 星期日"
-                  ariaRole="button"
-                  class="t-calendar__dates-item  t-calendar__dates-item--"
-                  data-date="{{
-                    Object {
-                      "date": Object {},
-                      "day": 23,
-                      "type": "",
-                    }
-                  }}"
-                  data-month="{{9}}"
-                  data-year="{{2022}}"
-                  bind:tap="handleSelect"
-                >
-                  
+            </wx-view>
+            <wx-view
+              ariaDisabled="{{false}}"
+              ariaLabel="10月23日, 星期日"
+              ariaRole="button"
+              class="t-calendar__dates-item  t-calendar__dates-item--"
+              data-date="{{
+                Object {
+                  "date": Object {},
+                  "day": 23,
+                  "type": "",
+                }
+              }}"
+              data-month="{{9}}"
+              data-year="{{2022}}"
+              bind:tap="handleSelect"
+            >
+              
             23
             
-                </wx-view>
-                <wx-view
-                  ariaDisabled="{{false}}"
-                  ariaLabel="10月24日, 星期一"
-                  ariaRole="button"
-                  class="t-calendar__dates-item  t-calendar__dates-item--"
-                  data-date="{{
-                    Object {
-                      "date": Object {},
-                      "day": 24,
-                      "type": "",
-                    }
-                  }}"
-                  data-month="{{9}}"
-                  data-year="{{2022}}"
-                  bind:tap="handleSelect"
-                >
-                  
+            </wx-view>
+            <wx-view
+              ariaDisabled="{{false}}"
+              ariaLabel="10月24日, 星期一"
+              ariaRole="button"
+              class="t-calendar__dates-item  t-calendar__dates-item--"
+              data-date="{{
+                Object {
+                  "date": Object {},
+                  "day": 24,
+                  "type": "",
+                }
+              }}"
+              data-month="{{9}}"
+              data-year="{{2022}}"
+              bind:tap="handleSelect"
+            >
+              
             24
             
-                </wx-view>
-                <wx-view
-                  ariaDisabled="{{false}}"
-                  ariaLabel="10月25日, 星期二"
-                  ariaRole="button"
-                  class="t-calendar__dates-item  t-calendar__dates-item--"
-                  data-date="{{
-                    Object {
-                      "date": Object {},
-                      "day": 25,
-                      "type": "",
-                    }
-                  }}"
-                  data-month="{{9}}"
-                  data-year="{{2022}}"
-                  bind:tap="handleSelect"
-                >
-                  
+            </wx-view>
+            <wx-view
+              ariaDisabled="{{false}}"
+              ariaLabel="10月25日, 星期二"
+              ariaRole="button"
+              class="t-calendar__dates-item  t-calendar__dates-item--"
+              data-date="{{
+                Object {
+                  "date": Object {},
+                  "day": 25,
+                  "type": "",
+                }
+              }}"
+              data-month="{{9}}"
+              data-year="{{2022}}"
+              bind:tap="handleSelect"
+            >
+              
             25
             
-                </wx-view>
-                <wx-view
-                  ariaDisabled="{{false}}"
-                  ariaLabel="10月26日, 星期三"
-                  ariaRole="button"
-                  class="t-calendar__dates-item  t-calendar__dates-item--"
-                  data-date="{{
-                    Object {
-                      "date": Object {},
-                      "day": 26,
-                      "type": "",
-                    }
-                  }}"
-                  data-month="{{9}}"
-                  data-year="{{2022}}"
-                  bind:tap="handleSelect"
-                >
-                  
+            </wx-view>
+            <wx-view
+              ariaDisabled="{{false}}"
+              ariaLabel="10月26日, 星期三"
+              ariaRole="button"
+              class="t-calendar__dates-item  t-calendar__dates-item--"
+              data-date="{{
+                Object {
+                  "date": Object {},
+                  "day": 26,
+                  "type": "",
+                }
+              }}"
+              data-month="{{9}}"
+              data-year="{{2022}}"
+              bind:tap="handleSelect"
+            >
+              
             26
             
-                </wx-view>
-                <wx-view
-                  ariaDisabled="{{false}}"
-                  ariaLabel="10月27日, 星期四"
-                  ariaRole="button"
-                  class="t-calendar__dates-item  t-calendar__dates-item--"
-                  data-date="{{
-                    Object {
-                      "date": Object {},
-                      "day": 27,
-                      "type": "",
-                    }
-                  }}"
-                  data-month="{{9}}"
-                  data-year="{{2022}}"
-                  bind:tap="handleSelect"
-                >
-                  
+            </wx-view>
+            <wx-view
+              ariaDisabled="{{false}}"
+              ariaLabel="10月27日, 星期四"
+              ariaRole="button"
+              class="t-calendar__dates-item  t-calendar__dates-item--"
+              data-date="{{
+                Object {
+                  "date": Object {},
+                  "day": 27,
+                  "type": "",
+                }
+              }}"
+              data-month="{{9}}"
+              data-year="{{2022}}"
+              bind:tap="handleSelect"
+            >
+              
             27
             
-                </wx-view>
-                <wx-view
-                  ariaDisabled="{{false}}"
-                  ariaLabel="10月28日, 星期五"
-                  ariaRole="button"
-                  class="t-calendar__dates-item  t-calendar__dates-item--"
-                  data-date="{{
-                    Object {
-                      "date": Object {},
-                      "day": 28,
-                      "type": "",
-                    }
-                  }}"
-                  data-month="{{9}}"
-                  data-year="{{2022}}"
-                  bind:tap="handleSelect"
-                >
-                  
+            </wx-view>
+            <wx-view
+              ariaDisabled="{{false}}"
+              ariaLabel="10月28日, 星期五"
+              ariaRole="button"
+              class="t-calendar__dates-item  t-calendar__dates-item--"
+              data-date="{{
+                Object {
+                  "date": Object {},
+                  "day": 28,
+                  "type": "",
+                }
+              }}"
+              data-month="{{9}}"
+              data-year="{{2022}}"
+              bind:tap="handleSelect"
+            >
+              
             28
             
-                </wx-view>
-                <wx-view
-                  ariaDisabled="{{false}}"
-                  ariaLabel="10月29日, 星期六"
-                  ariaRole="button"
-                  class="t-calendar__dates-item  t-calendar__dates-item--"
-                  data-date="{{
-                    Object {
-                      "date": Object {},
-                      "day": 29,
-                      "type": "",
-                    }
-                  }}"
-                  data-month="{{9}}"
-                  data-year="{{2022}}"
-                  bind:tap="handleSelect"
-                >
-                  
+            </wx-view>
+            <wx-view
+              ariaDisabled="{{false}}"
+              ariaLabel="10月29日, 星期六"
+              ariaRole="button"
+              class="t-calendar__dates-item  t-calendar__dates-item--"
+              data-date="{{
+                Object {
+                  "date": Object {},
+                  "day": 29,
+                  "type": "",
+                }
+              }}"
+              data-month="{{9}}"
+              data-year="{{2022}}"
+              bind:tap="handleSelect"
+            >
+              
             29
             
-                </wx-view>
-                <wx-view
-                  ariaDisabled="{{false}}"
-                  ariaLabel="10月30日, 星期日"
-                  ariaRole="button"
-                  class="t-calendar__dates-item  t-calendar__dates-item--"
-                  data-date="{{
-                    Object {
-                      "date": Object {},
-                      "day": 30,
-                      "type": "",
-                    }
-                  }}"
-                  data-month="{{9}}"
-                  data-year="{{2022}}"
-                  bind:tap="handleSelect"
-                >
-                  
+            </wx-view>
+            <wx-view
+              ariaDisabled="{{false}}"
+              ariaLabel="10月30日, 星期日"
+              ariaRole="button"
+              class="t-calendar__dates-item  t-calendar__dates-item--"
+              data-date="{{
+                Object {
+                  "date": Object {},
+                  "day": 30,
+                  "type": "",
+                }
+              }}"
+              data-month="{{9}}"
+              data-year="{{2022}}"
+              bind:tap="handleSelect"
+            >
+              
             30
             
-                </wx-view>
-                <wx-view
-                  ariaDisabled="{{false}}"
-                  ariaLabel="10月31日, 星期一"
-                  ariaRole="button"
-                  class="t-calendar__dates-item  t-calendar__dates-item--"
-                  data-date="{{
-                    Object {
-                      "date": Object {},
-                      "day": 31,
-                      "type": "",
-                    }
-                  }}"
-                  data-month="{{9}}"
-                  data-year="{{2022}}"
-                  bind:tap="handleSelect"
-                >
-                  
+            </wx-view>
+            <wx-view
+              ariaDisabled="{{false}}"
+              ariaLabel="10月31日, 星期一"
+              ariaRole="button"
+              class="t-calendar__dates-item  t-calendar__dates-item--"
+              data-date="{{
+                Object {
+                  "date": Object {},
+                  "day": 31,
+                  "type": "",
+                }
+              }}"
+              data-month="{{9}}"
+              data-year="{{2022}}"
+              bind:tap="handleSelect"
+            >
+              
             31
             
-                </wx-view>
-              </wx-view>
-            </wx-scroll-view>
-            <wx-view
-              class="t-calendar__footer"
-            >
-              <t-button
-                class="t-calendar__confirm-btn"
-                data-extra=""
-                data-type=""
-                tClass=""
-                bind:contact="onTplButtonTap"
-                bind:error="onTplButtonTap"
-                bind:getphonenumber="onTplButtonTap"
-                bind:getuserinfo="onTplButtonTap"
-                bind:launchapp="onTplButtonTap"
-                bind:opensetting="onTplButtonTap"
-                bind:tap="onTplButtonTap"
-              >
-                <wx-button
-                  appParameter=""
-                  ariaLabel=""
-                  class="class t-button t-class t-button--base t-button--primary t-button--rectangle t-button--size-medium t-button--block"
-                  data-custom="{{null}}"
-                  formType=""
-                  hoverClass="t-button--hover"
-                  hoverStartTime="{{20}}"
-                  hoverStayTime="{{70}}"
-                  hoverStopPropagation="{{false}}"
-                  lang="en"
-                  openType=""
-                  sendMessageImg=""
-                  sendMessagePath=""
-                  sendMessageTitle=""
-                  sessionFrom=""
-                  showMessageCard="{{false}}"
-                  style=""
-                  bind:chooseavatar="chooseavatar"
-                  bind:contact="contact"
-                  bind:error="error"
-                  bind:getphonenumber="getphonenumber"
-                  bind:getuserinfo="getuserinfo"
-                  bind:launchapp="launchapp"
-                  bind:opensetting="opensetting"
-                  catch:tap="handleTap"
-                >
-                  <wx-view
-                    class="t-button__content"
-                  >
-                    
-                    确定
-                  </wx-view>
-                </wx-button>
-              </t-button>
             </wx-view>
           </wx-view>
-          <wx-view
-            class="t-popup__close"
-            bind:tap="handleClose"
-          />
+        </wx-scroll-view>
+        <wx-view
+          class="t-calendar__footer"
+        >
+          <wx-button
+            appParameter=""
+            ariaLabel=""
+            class="class t-button t-class t-button--base t-button--primary t-button--rectangle t-button--size-medium t-button--block"
+            data-custom="{{null}}"
+            formType=""
+            hoverClass="t-button--hover"
+            hoverStartTime="{{20}}"
+            hoverStayTime="{{70}}"
+            hoverStopPropagation="{{false}}"
+            lang="en"
+            openType=""
+            sendMessageImg=""
+            sendMessagePath=""
+            sendMessageTitle=""
+            sessionFrom=""
+            showMessageCard="{{false}}"
+            style=""
+            bind:chooseavatar="chooseavatar"
+            bind:contact="contact"
+            bind:error="error"
+            bind:getphonenumber="getphonenumber"
+            bind:getuserinfo="getuserinfo"
+            bind:launchapp="launchapp"
+            bind:opensetting="opensetting"
+            catch:tap="handleTap"
+          >
+            <wx-view
+              class="t-button__content"
+            >
+              
+              确定
+            </wx-view>
+          </wx-button>
         </wx-view>
       </wx-view>
-      <t-overlay
-        id="popup-overlay"
-        bind:tap="handleOverlayClick"
-      >
-        <wx-view
-          ariaLabel="关闭"
-          ariaRole="button"
-          class="t-overlay t-fade-enter t-fade-enter-active class"
-          style="z-index:11000;"
-          bind:tap="handleClick"
-          catch:touchmove="noop"
-          bind:transitionend="onTransitionEnd"
-        />
-      </t-overlay>
-    </t-popup>
-  </t-calendar>
+      <wx-view
+        class="t-popup__close"
+        bind:tap="handleClose"
+      />
+    </wx-view>
+  </wx-view>
+  <wx-view
+    ariaLabel="关闭"
+    ariaRole="button"
+    class="t-overlay t-fade-enter t-fade-enter-active class"
+    style="z-index:11000;"
+    bind:tap="handleClick"
+    catch:touchmove="noop"
+    bind:transitionend="onTransitionEnd"
+  />
 </main>
 `;
diff --git a/src/cascader/cascader.wxml b/src/cascader/cascader.wxml
index af1d0a4a1..efcc0fb78 100644
--- a/src/cascader/cascader.wxml
+++ b/src/cascader/cascader.wxml
@@ -1,4 +1,5 @@
 <wxs src="../common/utils.wxs" module="_" />
+<wxs src="./cascader.wxs" module="aria" />
 
 <t-popup class="class" visible="{{visible}}" placement="bottom" bind:visible-change="onVisibleChange">
   <view style="{{_._style([style, customStyle])}}" class="{{name}}">
@@ -8,19 +9,27 @@
     </view>
     <view class="{{name}}__close-btn" bind:tap="onClose">
       <slot name="close-btn" />
-      <t-icon wx:if="{{closeBtn}}" size="24" name="close" />
+      <t-icon wx:if="{{closeBtn}}" aria-role="button" aria-label="关闭" size="24" name="close" />
     </view>
     <view class="{{name}}__content">
       <block wx:if="{{steps && steps.length}}">
         <view wx:if="{{theme == 'step'}}" class="{{name}}__steps">
-          <view wx:for="{{steps}}" wx:key="index" class="{{name}}__step" bind:tap="onStepClick" data-index="{{index}}">
+          <view
+            wx:for="{{steps}}"
+            wx:key="index"
+            class="{{name}}__step"
+            bind:tap="onStepClick"
+            data-index="{{index}}"
+            aria-role="{{ item === defaultOptionLabel ? 'option' : 'button' }}"
+            aria-label="{{ item === defaultOptionLabel ? item : aria.getAriaLabel(index, item)  }}"
+          >
             <view
               class="{{name}}__step-dot {{name}}__step-dot--{{item !== defaultOptionLabel ? 'active' : ''}} {{name}}__step-dot--{{index === steps.length - 1 ? 'last' : ''}}"
-            ></view>
+            />
             <view class="{{name}}__step-label {{name}}__step-label--{{index === stepIndex ? 'active' : ''}}">
               {{ item }}
             </view>
-            <t-icon name="chevron-right" size="22" t-class="{{name}}__step-arrow" />
+            <t-icon aria-hidden="{{true}}" name="chevron-right" size="22" t-class="{{name}}__step-arrow" />
           </view>
         </view>
         <block wx:if="{{theme == 'tab'}}">
@@ -29,28 +38,18 @@
           </t-tabs>
         </block>
       </block>
-      <view wx:if="{{ subTitles && subTitles[stepIndex] }}" class="{{name}}__options-title"
-        >{{subTitles[stepIndex]}}</view
-      >
-      <view
-        class="{{name}}__options-container"
-        style="width: {{items.length + 1}}00vw; transform: translateX(-{{stepIndex}}00vw)"
-      >
-        <scroll-view
-          wx:for="{{items}}"
-          wx:for-item="options"
-          wx:key="index"
-          class="{{name}}__options"
-          scroll-y
-          scroll-top="{{scrollTopList[index]}}"
-        >
-          <view class="cascader-radio-group-{{index}}">
+      <view wx:if="{{ subTitles && subTitles[stepIndex] }}" class="{{name}}__options-title">
+        {{subTitles[stepIndex]}}
+      </view>
+      <view class="{{name}}__options-container">
+        <scroll-view class="{{name}}__options" scroll-y scroll-top="{{scrollTopList[stepIndex]}}">
+          <view class="cascader-radio-group-{{stepIndex}}">
             <t-radio-group
-              value="{{selectedValue[index]}}"
+              value="{{selectedValue[stepIndex]}}"
               keys="{{keys}}"
-              options="{{options}}"
+              options="{{items[stepIndex]}}"
               bind:change="handleSelect"
-              data-level="{{index}}"
+              data-level="{{stepIndex}}"
               placement="right"
               icon="line"
               borderless
diff --git a/src/cascader/cascader.wxs b/src/cascader/cascader.wxs
new file mode 100644
index 000000000..34436f932
--- /dev/null
+++ b/src/cascader/cascader.wxs
@@ -0,0 +1,7 @@
+function getAriaLabel(index,  content) {
+  return '第' + (index + 1) + '级：'+ content;
+}
+
+module.exports = {
+  getAriaLabel: getAriaLabel,
+};
\ No newline at end of file
diff --git a/src/cell/__test__/__virtualHostSnapshot__/index.test.js.snap b/src/cell/__test__/__virtualHostSnapshot__/index.test.js.snap
index 888cd84d5..2173e21cf 100644
--- a/src/cell/__test__/__virtualHostSnapshot__/index.test.js.snap
+++ b/src/cell/__test__/__virtualHostSnapshot__/index.test.js.snap
@@ -2,56 +2,48 @@
 
 exports[`cell :base 1`] = `
 <main>
-  <main
-    id="cell"
+  <wx-view
+    ariaLabel=""
+    ariaRole=""
+    class="class t-class t-cell  t-cell--middle"
+    hoverClass=""
+    hoverStayTime="70"
+    style=""
+    bind:tap="onClick"
   >
     <wx-view
-      ariaLabel=""
-      ariaRole=""
-      class="class t-class t-cell  t-cell--middle"
-      hoverClass=""
-      hoverStayTime="70"
-      style=""
-      bind:tap="onClick"
+      class="t-cell__left t-class-left"
+    />
+    <wx-view
+      class="t-cell__title"
     >
       <wx-view
-        class="t-cell__left t-class-left"
+        class="t-cell__title-text  t-class-title"
       />
       <wx-view
-        class="t-cell__title"
-      >
-        <wx-view
-          class="t-cell__title-text  t-class-title"
-        />
-        <wx-view
-          class="t-cell__description t-class-description"
-        />
-      </wx-view>
-      <wx-view
-        class="t-cell__note t-class-note"
+        class="t-cell__description t-class-description"
       />
+    </wx-view>
+    <wx-view
+      class="t-cell__note t-class-note"
+    />
+    <wx-view
+      class="t-cell__right t-class-right"
+    >
       <wx-view
-        class="t-cell__right t-class-right"
+        ariaHidden="{{false}}"
+        ariaLabel=""
+        ariaRole=""
+        class="t-icon class t-class"
+        style=""
+        bind:tap="onTap"
       >
-        <t-icon
-          tClass="t-cell__right-icon t-class-right-icon"
-        >
-          <wx-view
-            ariaHidden="{{false}}"
-            ariaLabel=""
-            ariaRole=""
-            class="t-icon class t-class"
-            style=""
-            bind:tap="onTap"
-          >
-            <wx-label
-              class="t-icon- t-icon-base"
-            />
-          </wx-view>
-        </t-icon>
+        <wx-label
+          class="t-icon- t-icon-base"
+        />
       </wx-view>
     </wx-view>
-  </main>
+  </wx-view>
 </main>
 `;
 
diff --git a/src/collapse/__test__/__virtualHostSnapshot__/index.test.js.snap b/src/collapse/__test__/__virtualHostSnapshot__/index.test.js.snap
index 3c2af13a0..bbad0465c 100644
--- a/src/collapse/__test__/__virtualHostSnapshot__/index.test.js.snap
+++ b/src/collapse/__test__/__virtualHostSnapshot__/index.test.js.snap
@@ -1,183 +1,151 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`collapse :defaultExpandAll 1`] = `
-<t-collapse
-  id="expandAll"
+<wx-view
+  class="class t-class t-collapse t-collapse--default"
+  style=""
 >
   <wx-view
-    class="class t-class t-collapse t-collapse--default"
+    class="class t-collapse-panel t-collapse-panel--bottom t-class"
     style=""
   >
-    <t-collapse-panel>
+    <wx-view
+      ariaDisabled="{{false}}"
+      ariaExpanded="{{false}}"
+      ariaRole="button"
+      class="t-collapse-panel__title"
+      bind:tap="onClick"
+    >
       <wx-view
-        class="class t-collapse-panel t-collapse-panel--bottom t-class"
+        ariaLabel=""
+        ariaRole=""
+        class="class t-class t-cell  t-cell--middle"
+        hoverClass=""
+        hoverStayTime="70"
         style=""
+        bind:tap="onClick"
       >
         <wx-view
-          ariaDisabled="{{false}}"
-          ariaExpanded="{{false}}"
-          ariaRole="button"
-          class="t-collapse-panel__title"
-          bind:tap="onClick"
+          class="t-cell__left t-class-left"
+        />
+        <wx-view
+          class="t-cell__title"
         >
-          <t-cell
-            tClass="t-collapse-panel__header t-collapse-panel__header--bottom t-class-header"
-            tClassHover="class-header-hover"
-            tClassNote="class-note "
-            tClassRightIcon="class-right-icon t-collapse-panel__arrow--bottom "
-            tClassTitle="class-title "
+          <wx-view
+            class="t-cell__title-text  t-class-title"
           >
-            <wx-view
-              ariaLabel=""
-              ariaRole=""
-              class="class t-class t-cell  t-cell--middle"
-              hoverClass=""
-              hoverStayTime="70"
-              style=""
-              bind:tap="onClick"
-            >
-              <wx-view
-                class="t-cell__left t-class-left"
-              />
-              <wx-view
-                class="t-cell__title"
-              >
-                <wx-view
-                  class="t-cell__title-text  t-class-title"
-                >
-                   first 
-                </wx-view>
-                <wx-view
-                  class="t-cell__description t-class-description"
-                />
-              </wx-view>
-              <wx-view
-                class="t-cell__note t-class-note"
-              />
-              <wx-view
-                class="t-cell__right t-class-right"
-              >
-                <t-icon
-                  tClass="t-cell__right-icon t-class-right-icon"
-                >
-                  <wx-view
-                    ariaHidden="{{false}}"
-                    ariaLabel=""
-                    ariaRole=""
-                    class="t-icon class t-class"
-                    style=""
-                    bind:tap="onTap"
-                  >
-                    <wx-label
-                      class="t-icon-chevron-down t-icon-base"
-                    />
-                  </wx-view>
-                </t-icon>
-              </wx-view>
-            </wx-view>
-          </t-cell>
+             first 
+          </wx-view>
+          <wx-view
+            class="t-cell__description t-class-description"
+          />
         </wx-view>
         <wx-view
-          animation=""
-          ariaHidden="{{true}}"
-          class="t-collapse-panel__wrapper"
+          class="t-cell__note t-class-note"
+        />
+        <wx-view
+          class="t-cell__right t-class-right"
         >
           <wx-view
-            class="t-collapse-panel__content t-class-content"
+            ariaHidden="{{false}}"
+            ariaLabel=""
+            ariaRole=""
+            class="t-icon class t-class"
+            style=""
+            bind:tap="onTap"
           >
-            
-      
-      
-            内容1
+            <wx-label
+              class="t-icon-chevron-down t-icon-base"
+            />
           </wx-view>
         </wx-view>
       </wx-view>
-    </t-collapse-panel>
-    <t-collapse-panel>
+    </wx-view>
+    <wx-view
+      animation=""
+      ariaHidden="{{true}}"
+      class="t-collapse-panel__wrapper"
+    >
+      <wx-view
+        class="t-collapse-panel__content t-class-content"
+      >
+        
+      
+      
+        内容1
+      </wx-view>
+    </wx-view>
+  </wx-view>
+  <wx-view
+    class="class t-collapse-panel t-collapse-panel--bottom t-class"
+    style=""
+  >
+    <wx-view
+      ariaDisabled="{{false}}"
+      ariaExpanded="{{true}}"
+      ariaRole="button"
+      class="t-collapse-panel__title"
+      bind:tap="onClick"
+    >
       <wx-view
-        class="class t-collapse-panel t-collapse-panel--bottom t-class"
+        ariaLabel=""
+        ariaRole=""
+        class="class t-class t-cell  t-cell--middle"
+        hoverClass=""
+        hoverStayTime="70"
         style=""
+        bind:tap="onClick"
       >
         <wx-view
-          ariaDisabled="{{false}}"
-          ariaExpanded="{{true}}"
-          ariaRole="button"
-          class="t-collapse-panel__title"
-          bind:tap="onClick"
+          class="t-cell__left t-class-left"
+        />
+        <wx-view
+          class="t-cell__title"
         >
-          <t-cell
-            tClass="t-collapse-panel__header t-collapse-panel__header--bottom t-collapse-panel__header--expanded t-class-header"
-            tClassHover="class-header-hover"
-            tClassNote="class-note "
-            tClassRightIcon="class-right-icon t-collapse-panel__arrow--bottom "
-            tClassTitle="class-title "
+          <wx-view
+            class="t-cell__title-text  t-class-title"
           >
-            <wx-view
-              ariaLabel=""
-              ariaRole=""
-              class="class t-class t-cell  t-cell--middle"
-              hoverClass=""
-              hoverStayTime="70"
-              style=""
-              bind:tap="onClick"
-            >
-              <wx-view
-                class="t-cell__left t-class-left"
-              />
-              <wx-view
-                class="t-cell__title"
-              >
-                <wx-view
-                  class="t-cell__title-text  t-class-title"
-                >
-                   second 
-                </wx-view>
-                <wx-view
-                  class="t-cell__description t-class-description"
-                />
-              </wx-view>
-              <wx-view
-                class="t-cell__note t-class-note"
-              />
-              <wx-view
-                class="t-cell__right t-class-right"
-              >
-                <t-icon
-                  tClass="t-cell__right-icon t-class-right-icon"
-                >
-                  <wx-view
-                    ariaHidden="{{false}}"
-                    ariaLabel=""
-                    ariaRole=""
-                    class="t-icon class t-class"
-                    style=""
-                    bind:tap="onTap"
-                  >
-                    <wx-label
-                      class="t-icon-chevron-up t-icon-base"
-                    />
-                  </wx-view>
-                </t-icon>
-              </wx-view>
-            </wx-view>
-          </t-cell>
+             second 
+          </wx-view>
+          <wx-view
+            class="t-cell__description t-class-description"
+          />
         </wx-view>
         <wx-view
-          animation=""
-          ariaHidden=""
-          class="t-collapse-panel__wrapper"
+          class="t-cell__note t-class-note"
+        />
+        <wx-view
+          class="t-cell__right t-class-right"
         >
           <wx-view
-            class="t-collapse-panel__content t-class-content"
+            ariaHidden="{{false}}"
+            ariaLabel=""
+            ariaRole=""
+            class="t-icon class t-class"
+            style=""
+            bind:tap="onTap"
           >
-            
-      
-      
-            内容2
+            <wx-label
+              class="t-icon-chevron-up t-icon-base"
+            />
           </wx-view>
         </wx-view>
       </wx-view>
-    </t-collapse-panel>
+    </wx-view>
+    <wx-view
+      animation=""
+      ariaHidden=""
+      class="t-collapse-panel__wrapper"
+    >
+      <wx-view
+        class="t-collapse-panel__content t-class-content"
+      >
+        
+      
+      
+        内容2
+      </wx-view>
+    </wx-view>
   </wx-view>
-</t-collapse>
+</wx-view>
 `;
diff --git a/src/count-down/__test__/__virtualHostSnapshot__/index.test.js.snap b/src/count-down/__test__/__virtualHostSnapshot__/index.test.js.snap
index 311f3161a..c4b88938b 100644
--- a/src/count-down/__test__/__virtualHostSnapshot__/index.test.js.snap
+++ b/src/count-down/__test__/__virtualHostSnapshot__/index.test.js.snap
@@ -2,58 +2,48 @@
 
 exports[`countdown :autoStart 1`] = `
 <main>
-  <t-count-down>
-    <wx-view
-      ariaRole="option"
-      class="t-count-down t-count-down--default t-count-down--medium class t-class "
-      style=""
-    >
-      00 : 00 : 01
-    </wx-view>
-  </t-count-down>
+  <wx-view
+    ariaRole="option"
+    class="t-count-down t-count-down--default t-count-down--medium class t-class "
+    style=""
+  >
+    00 : 00 : 01
+  </wx-view>
 </main>
 `;
 
 exports[`countdown :base 1`] = `
 <main>
-  <t-count-down>
-    <wx-view
-      ariaRole="option"
-      class="t-count-down t-count-down--default t-count-down--medium class t-class "
-      style=""
-    >
-      00 : 00 : 01
-    </wx-view>
-  </t-count-down>
+  <wx-view
+    ariaRole="option"
+    class="t-count-down t-count-down--default t-count-down--medium class t-class "
+    style=""
+  >
+    00 : 00 : 01
+  </wx-view>
 </main>
 `;
 
 exports[`countdown :base 2`] = `
 <main>
-  <t-count-down>
-    <wx-view
-      ariaRole="option"
-      class="t-count-down t-count-down--default t-count-down--medium class t-class "
-      style=""
-    >
-      00 : 00 : 00
-    </wx-view>
-  </t-count-down>
+  <wx-view
+    ariaRole="option"
+    class="t-count-down t-count-down--default t-count-down--medium class t-class "
+    style=""
+  >
+    00 : 00 : 00
+  </wx-view>
 </main>
 `;
 
 exports[`countdown :millisecond 1`] = `
 <main>
-  <t-count-down
-    id="cd"
+  <wx-view
+    ariaRole="option"
+    class="t-count-down t-count-down--default t-count-down--medium class t-class "
+    style=""
   >
-    <wx-view
-      ariaRole="option"
-      class="t-count-down t-count-down--default t-count-down--medium class t-class "
-      style=""
-    >
-      00 : 00 : 00
-    </wx-view>
-  </t-count-down>
+    00 : 00 : 00
+  </wx-view>
 </main>
 `;
diff --git a/src/date-time-picker/__test__/__virtualHostSnapshot__/index.test.js.snap b/src/date-time-picker/__test__/__virtualHostSnapshot__/index.test.js.snap
index 134e5a7fe..b980c3e87 100644
--- a/src/date-time-picker/__test__/__virtualHostSnapshot__/index.test.js.snap
+++ b/src/date-time-picker/__test__/__virtualHostSnapshot__/index.test.js.snap
@@ -2,473 +2,442 @@
 
 exports[`date-time-picker :base 1`] = `
 <main>
-  <t-date-time-picker>
-    <t-picker
-      class="class t-class t-date-time-picker"
-      bind:cancel="onCancel"
-      bind:change="onConfirm"
-      bind:close="onClose"
-      bind:pick="onColumnChange"
-      bind:visible-change="onVisibleChange"
+  <wx-view
+    ariaModal="{{true}}"
+    ariaRole="dialog"
+    class="t-popup t-popup--bottom t-fade-enter t-fade-enter-active class t-class"
+    style="z-index:11500;"
+    bind:transitionend="onTransitionEnd"
+  >
+    <wx-view
+      class="t-popup__content t-class-content"
     >
-      <t-popup
-        class="class"
-        bind:visible-change="onPopupChange"
+      <wx-view
+        class="t-picker t-class"
+        slot="content"
+        style=""
       >
         <wx-view
-          ariaModal="{{true}}"
-          ariaRole="dialog"
-          class="t-popup t-popup--bottom t-fade-enter t-fade-enter-active class t-class"
-          style="z-index:11500;"
-          bind:transitionend="onTransitionEnd"
+          class="t-picker__toolbar"
         >
           <wx-view
-            class="t-popup__content t-class-content"
+            class="t-picker__cancel t-class-cancel"
+            bind:tap="onCancel"
+          >
+            取消
+          </wx-view>
+          <wx-view
+            class="t-picker__title t-class-title"
+          >
+            选择日期
+          </wx-view>
+          <wx-view
+            class="t-picker__confirm t-class-confirm"
+            bind:tap="onConfirm"
+          >
+            确定
+          </wx-view>
+        </wx-view>
+        <wx-view
+          class="t-picker__main"
+        >
+          <wx-view
+            class="t-picker-item__group class t-class"
+            style=""
+            bind:touchcancel="onTouchEnd"
+            bind:touchend="onTouchEnd"
+            catch:touchmove="onTouchMove"
+            bind:touchstart="onTouchStart"
           >
             <wx-view
-              class="t-picker t-class"
-              slot="content"
-              style=""
+              class="t-picker-item__wrapper"
+              style="transition: transform 0ms cubic-bezier(0.215, 0.61, 0.355, 1); transform: translate3d(0, -924px, 0)"
             >
               <wx-view
-                class="t-picker__toolbar"
-              >
-                <wx-view
-                  class="t-picker__cancel t-class-cancel"
-                  bind:tap="onCancel"
-                >
-                  取消
-                </wx-view>
-                <wx-view
-                  class="t-picker__title t-class-title"
-                >
-                  选择日期
-                </wx-view>
-                <wx-view
-                  class="t-picker__confirm t-class-confirm"
-                  bind:tap="onConfirm"
-                >
-                  确定
-                </wx-view>
-              </wx-view>
-              <wx-view
-                class="t-picker__main"
-              >
-                <t-picker-item
-                  class="t-date-time-picker__item"
-                  index="index"
-                >
-                  <wx-view
-                    class="t-picker-item__group class t-class"
-                    style=""
-                    bind:touchcancel="onTouchEnd"
-                    bind:touchend="onTouchEnd"
-                    catch:touchmove="onTouchMove"
-                    bind:touchstart="onTouchStart"
-                  >
-                    <wx-view
-                      class="t-picker-item__wrapper"
-                      style="transition: transform 0ms cubic-bezier(0.215, 0.61, 0.355, 1); transform: translate3d(0, -924px, 0)"
-                    >
-                      <wx-view
-                        class="t-picker-item__item"
-                        data-index="{{0}}"
-                      >
-                        
+                class="t-picker-item__item"
+                data-index="{{0}}"
+              >
+                
       2000年
     
-                      </wx-view>
-                      <wx-view
-                        class="t-picker-item__item"
-                        data-index="{{1}}"
-                      >
-                        
+              </wx-view>
+              <wx-view
+                class="t-picker-item__item"
+                data-index="{{1}}"
+              >
+                
       2001年
     
-                      </wx-view>
-                      <wx-view
-                        class="t-picker-item__item"
-                        data-index="{{2}}"
-                      >
-                        
+              </wx-view>
+              <wx-view
+                class="t-picker-item__item"
+                data-index="{{2}}"
+              >
+                
       2002年
     
-                      </wx-view>
-                      <wx-view
-                        class="t-picker-item__item"
-                        data-index="{{3}}"
-                      >
-                        
+              </wx-view>
+              <wx-view
+                class="t-picker-item__item"
+                data-index="{{3}}"
+              >
+                
       2003年
     
-                      </wx-view>
-                      <wx-view
-                        class="t-picker-item__item"
-                        data-index="{{4}}"
-                      >
-                        
+              </wx-view>
+              <wx-view
+                class="t-picker-item__item"
+                data-index="{{4}}"
+              >
+                
       2004年
     
-                      </wx-view>
-                      <wx-view
-                        class="t-picker-item__item"
-                        data-index="{{5}}"
-                      >
-                        
+              </wx-view>
+              <wx-view
+                class="t-picker-item__item"
+                data-index="{{5}}"
+              >
+                
       2005年
     
-                      </wx-view>
-                      <wx-view
-                        class="t-picker-item__item"
-                        data-index="{{6}}"
-                      >
-                        
+              </wx-view>
+              <wx-view
+                class="t-picker-item__item"
+                data-index="{{6}}"
+              >
+                
       2006年
     
-                      </wx-view>
-                      <wx-view
-                        class="t-picker-item__item"
-                        data-index="{{7}}"
-                      >
-                        
+              </wx-view>
+              <wx-view
+                class="t-picker-item__item"
+                data-index="{{7}}"
+              >
+                
       2007年
     
-                      </wx-view>
-                      <wx-view
-                        class="t-picker-item__item"
-                        data-index="{{8}}"
-                      >
-                        
+              </wx-view>
+              <wx-view
+                class="t-picker-item__item"
+                data-index="{{8}}"
+              >
+                
       2008年
     
-                      </wx-view>
-                      <wx-view
-                        class="t-picker-item__item"
-                        data-index="{{9}}"
-                      >
-                        
+              </wx-view>
+              <wx-view
+                class="t-picker-item__item"
+                data-index="{{9}}"
+              >
+                
       2009年
     
-                      </wx-view>
-                      <wx-view
-                        class="t-picker-item__item"
-                        data-index="{{10}}"
-                      >
-                        
+              </wx-view>
+              <wx-view
+                class="t-picker-item__item"
+                data-index="{{10}}"
+              >
+                
       2010年
     
-                      </wx-view>
-                      <wx-view
-                        class="t-picker-item__item"
-                        data-index="{{11}}"
-                      >
-                        
+              </wx-view>
+              <wx-view
+                class="t-picker-item__item"
+                data-index="{{11}}"
+              >
+                
       2011年
     
-                      </wx-view>
-                      <wx-view
-                        class="t-picker-item__item"
-                        data-index="{{12}}"
-                      >
-                        
+              </wx-view>
+              <wx-view
+                class="t-picker-item__item"
+                data-index="{{12}}"
+              >
+                
       2012年
     
-                      </wx-view>
-                      <wx-view
-                        class="t-picker-item__item"
-                        data-index="{{13}}"
-                      >
-                        
+              </wx-view>
+              <wx-view
+                class="t-picker-item__item"
+                data-index="{{13}}"
+              >
+                
       2013年
     
-                      </wx-view>
-                      <wx-view
-                        class="t-picker-item__item"
-                        data-index="{{14}}"
-                      >
-                        
+              </wx-view>
+              <wx-view
+                class="t-picker-item__item"
+                data-index="{{14}}"
+              >
+                
       2014年
     
-                      </wx-view>
-                      <wx-view
-                        class="t-picker-item__item"
-                        data-index="{{15}}"
-                      >
-                        
+              </wx-view>
+              <wx-view
+                class="t-picker-item__item"
+                data-index="{{15}}"
+              >
+                
       2015年
     
-                      </wx-view>
-                      <wx-view
-                        class="t-picker-item__item"
-                        data-index="{{16}}"
-                      >
-                        
+              </wx-view>
+              <wx-view
+                class="t-picker-item__item"
+                data-index="{{16}}"
+              >
+                
       2016年
     
-                      </wx-view>
-                      <wx-view
-                        class="t-picker-item__item"
-                        data-index="{{17}}"
-                      >
-                        
+              </wx-view>
+              <wx-view
+                class="t-picker-item__item"
+                data-index="{{17}}"
+              >
+                
       2017年
     
-                      </wx-view>
-                      <wx-view
-                        class="t-picker-item__item"
-                        data-index="{{18}}"
-                      >
-                        
+              </wx-view>
+              <wx-view
+                class="t-picker-item__item"
+                data-index="{{18}}"
+              >
+                
       2018年
     
-                      </wx-view>
-                      <wx-view
-                        class="t-picker-item__item"
-                        data-index="{{19}}"
-                      >
-                        
+              </wx-view>
+              <wx-view
+                class="t-picker-item__item"
+                data-index="{{19}}"
+              >
+                
       2019年
     
-                      </wx-view>
-                      <wx-view
-                        class="t-picker-item__item"
-                        data-index="{{20}}"
-                      >
-                        
+              </wx-view>
+              <wx-view
+                class="t-picker-item__item"
+                data-index="{{20}}"
+              >
+                
       2020年
     
-                      </wx-view>
-                      <wx-view
-                        class="t-picker-item__item t-picker-item__item--active"
-                        data-index="{{21}}"
-                      >
-                        
+              </wx-view>
+              <wx-view
+                class="t-picker-item__item t-picker-item__item--active"
+                data-index="{{21}}"
+              >
+                
       2021年
     
-                      </wx-view>
-                      <wx-view
-                        class="t-picker-item__item"
-                        data-index="{{22}}"
-                      >
-                        
+              </wx-view>
+              <wx-view
+                class="t-picker-item__item"
+                data-index="{{22}}"
+              >
+                
       2022年
     
-                      </wx-view>
-                      <wx-view
-                        class="t-picker-item__item"
-                        data-index="{{23}}"
-                      >
-                        
+              </wx-view>
+              <wx-view
+                class="t-picker-item__item"
+                data-index="{{23}}"
+              >
+                
       2023年
     
-                      </wx-view>
-                      <wx-view
-                        class="t-picker-item__item"
-                        data-index="{{24}}"
-                      >
-                        
+              </wx-view>
+              <wx-view
+                class="t-picker-item__item"
+                data-index="{{24}}"
+              >
+                
       2024年
     
-                      </wx-view>
-                      <wx-view
-                        class="t-picker-item__item"
-                        data-index="{{25}}"
-                      >
-                        
+              </wx-view>
+              <wx-view
+                class="t-picker-item__item"
+                data-index="{{25}}"
+              >
+                
       2025年
     
-                      </wx-view>
-                      <wx-view
-                        class="t-picker-item__item"
-                        data-index="{{26}}"
-                      >
-                        
+              </wx-view>
+              <wx-view
+                class="t-picker-item__item"
+                data-index="{{26}}"
+              >
+                
       2026年
     
-                      </wx-view>
-                      <wx-view
-                        class="t-picker-item__item"
-                        data-index="{{27}}"
-                      >
-                        
+              </wx-view>
+              <wx-view
+                class="t-picker-item__item"
+                data-index="{{27}}"
+              >
+                
       2027年
     
-                      </wx-view>
-                      <wx-view
-                        class="t-picker-item__item"
-                        data-index="{{28}}"
-                      >
-                        
+              </wx-view>
+              <wx-view
+                class="t-picker-item__item"
+                data-index="{{28}}"
+              >
+                
       2028年
     
-                      </wx-view>
-                      <wx-view
-                        class="t-picker-item__item"
-                        data-index="{{29}}"
-                      >
-                        
+              </wx-view>
+              <wx-view
+                class="t-picker-item__item"
+                data-index="{{29}}"
+              >
+                
       2029年
     
-                      </wx-view>
-                      <wx-view
-                        class="t-picker-item__item"
-                        data-index="{{30}}"
-                      >
-                        
+              </wx-view>
+              <wx-view
+                class="t-picker-item__item"
+                data-index="{{30}}"
+              >
+                
       2030年
     
-                      </wx-view>
-                    </wx-view>
-                  </wx-view>
-                </t-picker-item>
-                <t-picker-item
-                  class="t-date-time-picker__item"
-                  index="index"
-                >
-                  <wx-view
-                    class="t-picker-item__group class t-class"
-                    style=""
-                    bind:touchcancel="onTouchEnd"
-                    bind:touchend="onTouchEnd"
-                    catch:touchmove="onTouchMove"
-                    bind:touchstart="onTouchStart"
-                  >
-                    <wx-view
-                      class="t-picker-item__wrapper"
-                      style="transition: transform 0ms cubic-bezier(0.215, 0.61, 0.355, 1); transform: translate3d(0, -352px, 0)"
-                    >
-                      <wx-view
-                        class="t-picker-item__item"
-                        data-index="{{0}}"
-                      >
-                        
+              </wx-view>
+            </wx-view>
+          </wx-view>
+          <wx-view
+            class="t-picker-item__group class t-class"
+            style=""
+            bind:touchcancel="onTouchEnd"
+            bind:touchend="onTouchEnd"
+            catch:touchmove="onTouchMove"
+            bind:touchstart="onTouchStart"
+          >
+            <wx-view
+              class="t-picker-item__wrapper"
+              style="transition: transform 0ms cubic-bezier(0.215, 0.61, 0.355, 1); transform: translate3d(0, -352px, 0)"
+            >
+              <wx-view
+                class="t-picker-item__item"
+                data-index="{{0}}"
+              >
+                
       1月
     
-                      </wx-view>
-                      <wx-view
-                        class="t-picker-item__item"
-                        data-index="{{1}}"
-                      >
-                        
+              </wx-view>
+              <wx-view
+                class="t-picker-item__item"
+                data-index="{{1}}"
+              >
+                
       2月
     
-                      </wx-view>
-                      <wx-view
-                        class="t-picker-item__item"
-                        data-index="{{2}}"
-                      >
-                        
+              </wx-view>
+              <wx-view
+                class="t-picker-item__item"
+                data-index="{{2}}"
+              >
+                
       3月
     
-                      </wx-view>
-                      <wx-view
-                        class="t-picker-item__item"
-                        data-index="{{3}}"
-                      >
-                        
+              </wx-view>
+              <wx-view
+                class="t-picker-item__item"
+                data-index="{{3}}"
+              >
+                
       4月
     
-                      </wx-view>
-                      <wx-view
-                        class="t-picker-item__item"
-                        data-index="{{4}}"
-                      >
-                        
+              </wx-view>
+              <wx-view
+                class="t-picker-item__item"
+                data-index="{{4}}"
+              >
+                
       5月
     
-                      </wx-view>
-                      <wx-view
-                        class="t-picker-item__item"
-                        data-index="{{5}}"
-                      >
-                        
+              </wx-view>
+              <wx-view
+                class="t-picker-item__item"
+                data-index="{{5}}"
+              >
+                
       6月
     
-                      </wx-view>
-                      <wx-view
-                        class="t-picker-item__item"
-                        data-index="{{6}}"
-                      >
-                        
+              </wx-view>
+              <wx-view
+                class="t-picker-item__item"
+                data-index="{{6}}"
+              >
+                
       7月
     
-                      </wx-view>
-                      <wx-view
-                        class="t-picker-item__item"
-                        data-index="{{7}}"
-                      >
-                        
+              </wx-view>
+              <wx-view
+                class="t-picker-item__item"
+                data-index="{{7}}"
+              >
+                
       8月
     
-                      </wx-view>
-                      <wx-view
-                        class="t-picker-item__item t-picker-item__item--active"
-                        data-index="{{8}}"
-                      >
-                        
+              </wx-view>
+              <wx-view
+                class="t-picker-item__item t-picker-item__item--active"
+                data-index="{{8}}"
+              >
+                
       9月
     
-                      </wx-view>
-                      <wx-view
-                        class="t-picker-item__item"
-                        data-index="{{9}}"
-                      >
-                        
+              </wx-view>
+              <wx-view
+                class="t-picker-item__item"
+                data-index="{{9}}"
+              >
+                
       10月
     
-                      </wx-view>
-                      <wx-view
-                        class="t-picker-item__item"
-                        data-index="{{10}}"
-                      >
-                        
+              </wx-view>
+              <wx-view
+                class="t-picker-item__item"
+                data-index="{{10}}"
+              >
+                
       11月
     
-                      </wx-view>
-                      <wx-view
-                        class="t-picker-item__item"
-                        data-index="{{11}}"
-                      >
-                        
+              </wx-view>
+              <wx-view
+                class="t-picker-item__item"
+                data-index="{{11}}"
+              >
+                
       12月
     
-                      </wx-view>
-                    </wx-view>
-                  </wx-view>
-                </t-picker-item>
-                <wx-view
-                  class="t-picker__mask t-picker__mask--top"
-                />
-                <wx-view
-                  class="t-picker__mask t-picker__mask--bottom"
-                />
-                <wx-view
-                  class="t-picker__indicator"
-                />
               </wx-view>
             </wx-view>
-            <wx-view
-              class="t-popup__close"
-              bind:tap="handleClose"
-            />
           </wx-view>
-        </wx-view>
-        <t-overlay
-          id="popup-overlay"
-          bind:tap="handleOverlayClick"
-        >
           <wx-view
-            ariaLabel="关闭"
-            ariaRole="button"
-            class="t-overlay t-fade-enter t-fade-enter-active class"
-            style="z-index:11000;"
-            bind:tap="handleClick"
-            catch:touchmove="noop"
-            bind:transitionend="onTransitionEnd"
+            class="t-picker__mask t-picker__mask--top"
           />
-        </t-overlay>
-      </t-popup>
-    </t-picker>
-  </t-date-time-picker>
+          <wx-view
+            class="t-picker__mask t-picker__mask--bottom"
+          />
+          <wx-view
+            class="t-picker__indicator"
+          />
+        </wx-view>
+      </wx-view>
+      <wx-view
+        class="t-popup__close"
+        bind:tap="handleClose"
+      />
+    </wx-view>
+  </wx-view>
+  <wx-view
+    ariaLabel="关闭"
+    ariaRole="button"
+    class="t-overlay t-fade-enter t-fade-enter-active class"
+    style="z-index:11000;"
+    bind:tap="handleClick"
+    catch:touchmove="noop"
+    bind:transitionend="onTransitionEnd"
+  />
 </main>
 `;
diff --git a/src/dialog/__test__/__virtualHostSnapshot__/index.test.js.snap b/src/dialog/__test__/__virtualHostSnapshot__/index.test.js.snap
index ed8c9a385..0ffdddadb 100644
--- a/src/dialog/__test__/__virtualHostSnapshot__/index.test.js.snap
+++ b/src/dialog/__test__/__virtualHostSnapshot__/index.test.js.snap
@@ -2,56 +2,41 @@
 
 exports[`dialog :base 1`] = `
 <main>
-  <t-dialog
-    id="dialog"
+  <wx-view
+    ariaModal="{{true}}"
+    ariaRole="dialog"
+    class="t-popup t-popup--center t-dialog-enter t-dialog-enter-active class t-class"
+    style="z-index:11500;"
+    bind:transitionend="onTransitionEnd"
   >
-    <t-popup
-      class="class"
-      tClass="t-dialog__wrapper"
-      bind:visible-change="overlayClick"
+    <wx-view
+      class="t-popup__content t-class-content"
     >
       <wx-view
-        ariaModal="{{true}}"
-        ariaRole="dialog"
-        class="t-popup t-popup--center t-dialog-enter t-dialog-enter-active class t-class"
-        style="z-index:11500;"
-        bind:transitionend="onTransitionEnd"
+        class="t-dialog t-class"
+        slot="content"
       >
         <wx-view
-          class="t-popup__content t-class-content"
-        >
-          <wx-view
-            class="t-dialog t-class"
-            slot="content"
-          >
-            <wx-view
-              class="t-dialog__content t-class-content"
-            />
-            <wx-view
-              class="t-dialog__footer t-dialog__footer--full"
-            />
-          </wx-view>
-          <wx-view
-            class="t-popup__close"
-            bind:tap="handleClose"
-          />
-        </wx-view>
-      </wx-view>
-      <t-overlay
-        id="popup-overlay"
-        bind:tap="handleOverlayClick"
-      >
+          class="t-dialog__content t-class-content"
+        />
         <wx-view
-          ariaLabel="关闭"
-          ariaRole="button"
-          class="t-overlay t-fade-enter t-fade-enter-active class"
-          style="z-index:11000;"
-          bind:tap="handleClick"
-          catch:touchmove="noop"
-          bind:transitionend="onTransitionEnd"
+          class="t-dialog__footer t-dialog__footer--full"
         />
-      </t-overlay>
-    </t-popup>
-  </t-dialog>
+      </wx-view>
+      <wx-view
+        class="t-popup__close"
+        bind:tap="handleClose"
+      />
+    </wx-view>
+  </wx-view>
+  <wx-view
+    ariaLabel="关闭"
+    ariaRole="button"
+    class="t-overlay t-fade-enter t-fade-enter-active class"
+    style="z-index:11000;"
+    bind:tap="handleClick"
+    catch:touchmove="noop"
+    bind:transitionend="onTransitionEnd"
+  />
 </main>
 `;
diff --git a/src/divider/__test__/__virtualHostSnapshot__/index.test.js.snap b/src/divider/__test__/__virtualHostSnapshot__/index.test.js.snap
index 473ce46af..4fd1b24d2 100644
--- a/src/divider/__test__/__virtualHostSnapshot__/index.test.js.snap
+++ b/src/divider/__test__/__virtualHostSnapshot__/index.test.js.snap
@@ -2,21 +2,17 @@
 
 exports[`Divider :base 1`] = `
 <main>
-  <t-divider
-    class="divider"
+  <wx-view
+    class="class t-class "
   >
     <wx-view
-      class="class t-class "
+      class="t-divider t-divider--horizontal t-divider--center  "
+      style=""
     >
       <wx-view
-        class="t-divider t-divider--horizontal t-divider--center  "
-        style=""
-      >
-        <wx-view
-          class="t-class-content t-divider__content"
-        />
-      </wx-view>
+        class="t-class-content t-divider__content"
+      />
     </wx-view>
-  </t-divider>
+  </wx-view>
 </main>
 `;
diff --git a/src/dropdown-menu/__test__/__virtualHostSnapshot__/index.test.js.snap b/src/dropdown-menu/__test__/__virtualHostSnapshot__/index.test.js.snap
index 7ec4c127e..6cbb256a4 100644
--- a/src/dropdown-menu/__test__/__virtualHostSnapshot__/index.test.js.snap
+++ b/src/dropdown-menu/__test__/__virtualHostSnapshot__/index.test.js.snap
@@ -2,639 +2,534 @@
 
 exports[`dropdown-menu :base 1`] = `
 <main>
-  <t-dropdown-menu
-    id="base"
+  <wx-view
+    class="t-dropdown-menu class t-class"
+    id="t-bar"
+    style="color: red; font-size: 9px;"
   >
     <wx-view
-      class="t-dropdown-menu class t-class"
-      id="t-bar"
-      style="color: red; font-size: 9px;"
+      ariaDisabled="{{false}}"
+      ariaExpanded="{{true}}"
+      ariaHaspopup="menu"
+      ariaRole="button"
+      class="t-dropdown-menu__item t-dropdown-menu__item--active t-class-item"
+      data-index="{{0}}"
+      bind:tap="handleToggle"
     >
       <wx-view
-        ariaDisabled="{{false}}"
-        ariaExpanded="{{true}}"
-        ariaHaspopup="menu"
-        ariaRole="button"
-        class="t-dropdown-menu__item t-dropdown-menu__item--active t-class-item"
-        data-index="{{0}}"
-        bind:tap="handleToggle"
+        class="t-dropdown-menu__title t-class-label"
       >
-        <wx-view
-          class="t-dropdown-menu__title t-class-label"
-        >
-          菜单
-        </wx-view>
-        <t-icon
-          tClass="t-dropdown-menu__icon t-dropdown-menu__icon--active t-class-icon"
-        >
-          <wx-view
-            ariaHidden="{{true}}"
-            ariaLabel=""
-            ariaRole=""
-            class="t-icon class t-class"
-            style=""
-            bind:tap="onTap"
-          >
-            <wx-label
-              class="t-icon-caret-down-small t-icon-base"
-            />
-          </wx-view>
-        </t-icon>
+        菜单
       </wx-view>
       <wx-view
-        ariaDisabled="{{false}}"
-        ariaExpanded="{{false}}"
-        ariaHaspopup="menu"
-        ariaRole="button"
-        class="t-dropdown-menu__item t-class-item"
-        data-index="{{1}}"
-        bind:tap="handleToggle"
+        ariaHidden="{{true}}"
+        ariaLabel=""
+        ariaRole=""
+        class="t-icon class t-class"
+        style=""
+        bind:tap="onTap"
       >
-        <wx-view
-          class="t-dropdown-menu__title t-class-label"
-        >
-          单列多选
-        </wx-view>
-        <t-icon
-          tClass="t-dropdown-menu__icon t-dropdown-menu__icon-- t-class-icon"
-        >
-          <wx-view
-            ariaHidden="{{true}}"
-            ariaLabel=""
-            ariaRole=""
-            class="t-icon class t-class"
-            style=""
-            bind:tap="onTap"
-          >
-            <wx-label
-              class="t-icon-caret-down-small t-icon-base"
-            />
-          </wx-view>
-        </t-icon>
+        <wx-label
+          class="t-icon-caret-down-small t-icon-base"
+        />
+      </wx-view>
+    </wx-view>
+    <wx-view
+      ariaDisabled="{{false}}"
+      ariaExpanded="{{false}}"
+      ariaHaspopup="menu"
+      ariaRole="button"
+      class="t-dropdown-menu__item t-class-item"
+      data-index="{{1}}"
+      bind:tap="handleToggle"
+    >
+      <wx-view
+        class="t-dropdown-menu__title t-class-label"
+      >
+        单列多选
+      </wx-view>
+      <wx-view
+        ariaHidden="{{true}}"
+        ariaLabel=""
+        ariaRole=""
+        class="t-icon class t-class"
+        style=""
+        bind:tap="onTap"
+      >
+        <wx-label
+          class="t-icon-caret-down-small t-icon-base"
+        />
       </wx-view>
-      <t-dropdown-item
-        id="first"
-        bind:change="handleSingleSelect"
+    </wx-view>
+    <wx-view
+      class="t-dropdown-item class t-class"
+      style="z-index:11600;"
+    >
+      <wx-view
+        ariaModal="{{true}}"
+        ariaRole="dialog"
+        class="t-popup t-popup--top t-fade-enter-active t-fade-enter-to class t-class"
+        style="z-index:11601; position: absolute;"
+        bind:transitionend="onTransitionEnd"
       >
         <wx-view
-          class="t-dropdown-item class t-class"
-          style="z-index:11600;"
+          class="t-popup__content t-class-content"
         >
-          <t-popup
-            tClass="t-dropdown-item__popup-host"
-            tClassContent="t-dropdown-item__content t-class-content"
-            bind:leaved="onLeaved"
-            bind:visible-change="handleMaskClick"
+          <wx-view
+            class="t-dropdown-item__body"
           >
-            <wx-view
-              ariaModal="{{true}}"
-              ariaRole="dialog"
-              class="t-popup t-popup--top t-fade-enter t-fade-enter-active class t-class"
-              style="z-index:11601; position: absolute;"
-              bind:transitionend="onTransitionEnd"
+            <wx-scroll-view
+              class="t-dropdown-item__scroll"
+              scrollIntoView="id_option_3"
+              scrollY="{{true}}"
             >
               <wx-view
-                class="t-popup__content t-class-content"
+                ariaRole="radiogroup"
+                class="t-radio-group class t-class"
+                style="grid-template-columns: repeat(1, 1fr);"
               >
                 <wx-view
-                  class="t-dropdown-item__body"
+                  id="id_option_1"
                 >
-                  <wx-scroll-view
-                    class="t-dropdown-item__scroll"
-                    scrollIntoView="id_option_3"
-                    scrollY="{{true}}"
+                  <wx-view
+                    ariaChecked="{{false}}"
+                    ariaDisabled="{{false}}"
+                    ariaLabel="选项一"
+                    ariaRole="radio"
+                    class="t-radio t-radio--block class t-class"
+                    disabled="{{false}}"
+                    style=""
+                    tabindex=""
+                    bind:tap="handleTap"
                   >
-                    <t-radio-group
-                      class="t-dropdown-item__radio t-class-column"
-                      tClass="t-dropdown-item__radio-group"
-                      bind:change="handleRadioChange"
+                    <wx-view
+                      class="t-radio__icon t-class-icon"
+                    >
+                      <wx-view
+                        class="placeholder"
+                      />
+                    </wx-view>
+                    <wx-view
+                      class="t-radio__content"
+                      data-target="text"
+                      catch:tap="handleTap"
                     >
                       <wx-view
-                        ariaRole="radiogroup"
-                        class="t-radio-group class t-class"
-                        style="grid-template-columns: repeat(1, 1fr);"
+                        class="t-radio__title t-class-label"
+                        style="-webkit-line-clamp:3"
                       >
-                        <wx-view
-                          id="id_option_1"
-                        >
-                          <t-radio
-                            class="t-dropdown-item__radio-item t-class-column-item"
-                            tabindex="0"
-                            tClass="radio"
-                            tClassLabel="t-class-column-item-label"
-                          >
-                            <wx-view
-                              ariaChecked="{{false}}"
-                              ariaDisabled="{{false}}"
-                              ariaLabel="选项一"
-                              ariaRole="radio"
-                              class="t-radio t-radio--block class t-class"
-                              disabled="{{false}}"
-                              style=""
-                              tabindex=""
-                              bind:tap="handleTap"
-                            >
-                              <wx-view
-                                class="t-radio__icon t-class-icon"
-                              >
-                                <wx-view
-                                  class="placeholder"
-                                />
-                              </wx-view>
-                              <wx-view
-                                class="t-radio__content"
-                                data-target="text"
-                                catch:tap="handleTap"
-                              >
-                                <wx-view
-                                  class="t-radio__title t-class-label"
-                                  style="-webkit-line-clamp:3"
-                                >
-                                  
+                        
       选项一
       
-                                </wx-view>
-                                <wx-view
-                                  class="t-radio__description t-class-content "
-                                  style="-webkit-line-clamp:5"
-                                >
-                                  
-                                </wx-view>
-                              </wx-view>
-                              <wx-view
-                                class="t-radio__border t-class-border"
-                              />
-                            </wx-view>
-                          </t-radio>
-                        </wx-view>
-                        <wx-view
-                          id="id_option_2"
-                        >
-                          <t-radio
-                            class="t-dropdown-item__radio-item t-class-column-item"
-                            tabindex="0"
-                            tClass="radio"
-                            tClassLabel="t-class-column-item-label"
-                          >
-                            <wx-view
-                              ariaChecked="{{false}}"
-                              ariaDisabled="{{false}}"
-                              ariaLabel="选项二"
-                              ariaRole="radio"
-                              class="t-radio t-radio--block class t-class"
-                              disabled="{{false}}"
-                              style=""
-                              tabindex=""
-                              bind:tap="handleTap"
-                            >
-                              <wx-view
-                                class="t-radio__icon t-class-icon"
-                              >
-                                <wx-view
-                                  class="placeholder"
-                                />
-                              </wx-view>
-                              <wx-view
-                                class="t-radio__content"
-                                data-target="text"
-                                catch:tap="handleTap"
-                              >
-                                <wx-view
-                                  class="t-radio__title t-class-label"
-                                  style="-webkit-line-clamp:3"
-                                >
-                                  
+                      </wx-view>
+                      <wx-view
+                        class="t-radio__description t-class-content "
+                        style="-webkit-line-clamp:5"
+                      >
+                        
+                      </wx-view>
+                    </wx-view>
+                    <wx-view
+                      class="t-radio__border t-class-border"
+                    />
+                  </wx-view>
+                </wx-view>
+                <wx-view
+                  id="id_option_2"
+                >
+                  <wx-view
+                    ariaChecked="{{false}}"
+                    ariaDisabled="{{false}}"
+                    ariaLabel="选项二"
+                    ariaRole="radio"
+                    class="t-radio t-radio--block class t-class"
+                    disabled="{{false}}"
+                    style=""
+                    tabindex=""
+                    bind:tap="handleTap"
+                  >
+                    <wx-view
+                      class="t-radio__icon t-class-icon"
+                    >
+                      <wx-view
+                        class="placeholder"
+                      />
+                    </wx-view>
+                    <wx-view
+                      class="t-radio__content"
+                      data-target="text"
+                      catch:tap="handleTap"
+                    >
+                      <wx-view
+                        class="t-radio__title t-class-label"
+                        style="-webkit-line-clamp:3"
+                      >
+                        
       选项二
       
-                                </wx-view>
-                                <wx-view
-                                  class="t-radio__description t-class-content "
-                                  style="-webkit-line-clamp:5"
-                                >
-                                  
-                                </wx-view>
-                              </wx-view>
-                              <wx-view
-                                class="t-radio__border t-class-border"
-                              />
-                            </wx-view>
-                          </t-radio>
-                        </wx-view>
-                        <wx-view
-                          id="id_option_3"
-                        >
-                          <t-radio
-                            class="t-dropdown-item__radio-item t-class-column-item"
-                            tabindex="0"
-                            tClass="radio"
-                            tClassLabel="t-class-column-item-label"
-                          >
-                            <wx-view
-                              ariaChecked="{{true}}"
-                              ariaDisabled="{{false}}"
-                              ariaLabel="选项三"
-                              ariaRole="radio"
-                              class="t-radio t-radio--block class t-class"
-                              disabled="{{false}}"
-                              style=""
-                              tabindex=""
-                              bind:tap="handleTap"
-                            >
-                              <wx-view
-                                class="t-radio__icon t-radio__icon--checked t-class-icon"
-                              >
-                                <t-icon
-                                  class="t-radio__icon-wrap"
-                                >
-                                  <wx-view
-                                    ariaHidden="{{false}}"
-                                    ariaLabel=""
-                                    ariaRole=""
-                                    class="t-icon class t-class"
-                                    style=""
-                                    bind:tap="onTap"
-                                  >
-                                    <wx-label
-                                      class="t-icon-check t-icon-base"
-                                    />
-                                  </wx-view>
-                                </t-icon>
-                              </wx-view>
-                              <wx-view
-                                class="t-radio__content"
-                                data-target="text"
-                                catch:tap="handleTap"
-                              >
-                                <wx-view
-                                  class="t-radio__title t-radio__title--checked t-class-label"
-                                  style="-webkit-line-clamp:3"
-                                >
-                                  
+                      </wx-view>
+                      <wx-view
+                        class="t-radio__description t-class-content "
+                        style="-webkit-line-clamp:5"
+                      >
+                        
+                      </wx-view>
+                    </wx-view>
+                    <wx-view
+                      class="t-radio__border t-class-border"
+                    />
+                  </wx-view>
+                </wx-view>
+                <wx-view
+                  id="id_option_3"
+                >
+                  <wx-view
+                    ariaChecked="{{true}}"
+                    ariaDisabled="{{false}}"
+                    ariaLabel="选项三"
+                    ariaRole="radio"
+                    class="t-radio t-radio--block class t-class"
+                    disabled="{{false}}"
+                    style=""
+                    tabindex=""
+                    bind:tap="handleTap"
+                  >
+                    <wx-view
+                      class="t-radio__icon t-radio__icon--checked t-class-icon"
+                    >
+                      <wx-view
+                        ariaHidden="{{false}}"
+                        ariaLabel=""
+                        ariaRole=""
+                        class="t-icon class t-class"
+                        style=""
+                        bind:tap="onTap"
+                      >
+                        <wx-label
+                          class="t-icon-check t-icon-base"
+                        />
+                      </wx-view>
+                    </wx-view>
+                    <wx-view
+                      class="t-radio__content"
+                      data-target="text"
+                      catch:tap="handleTap"
+                    >
+                      <wx-view
+                        class="t-radio__title t-radio__title--checked t-class-label"
+                        style="-webkit-line-clamp:3"
+                      >
+                        
       选项三
       
-                                </wx-view>
-                                <wx-view
-                                  class="t-radio__description t-radio__description--checked t-class-content "
-                                  style="-webkit-line-clamp:5"
-                                >
-                                  
-                                </wx-view>
-                              </wx-view>
-                              <wx-view
-                                class="t-radio__border t-class-border"
-                              />
-                            </wx-view>
-                          </t-radio>
-                        </wx-view>
-                        <wx-view
-                          id="id_option_4"
-                        >
-                          <t-radio
-                            class="t-dropdown-item__radio-item t-class-column-item"
-                            tabindex="0"
-                            tClass="radio"
-                            tClassLabel="t-class-column-item-label"
-                          >
-                            <wx-view
-                              ariaChecked="{{false}}"
-                              ariaDisabled="{{false}}"
-                              ariaLabel="选项四"
-                              ariaRole="radio"
-                              class="t-radio t-radio--block class t-class"
-                              disabled="{{false}}"
-                              style=""
-                              tabindex=""
-                              bind:tap="handleTap"
-                            >
-                              <wx-view
-                                class="t-radio__icon t-class-icon"
-                              >
-                                <wx-view
-                                  class="placeholder"
-                                />
-                              </wx-view>
-                              <wx-view
-                                class="t-radio__content"
-                                data-target="text"
-                                catch:tap="handleTap"
-                              >
-                                <wx-view
-                                  class="t-radio__title t-class-label"
-                                  style="-webkit-line-clamp:3"
-                                >
-                                  
+                      </wx-view>
+                      <wx-view
+                        class="t-radio__description t-radio__description--checked t-class-content "
+                        style="-webkit-line-clamp:5"
+                      >
+                        
+                      </wx-view>
+                    </wx-view>
+                    <wx-view
+                      class="t-radio__border t-class-border"
+                    />
+                  </wx-view>
+                </wx-view>
+                <wx-view
+                  id="id_option_4"
+                >
+                  <wx-view
+                    ariaChecked="{{false}}"
+                    ariaDisabled="{{false}}"
+                    ariaLabel="选项四"
+                    ariaRole="radio"
+                    class="t-radio t-radio--block class t-class"
+                    disabled="{{false}}"
+                    style=""
+                    tabindex=""
+                    bind:tap="handleTap"
+                  >
+                    <wx-view
+                      class="t-radio__icon t-class-icon"
+                    >
+                      <wx-view
+                        class="placeholder"
+                      />
+                    </wx-view>
+                    <wx-view
+                      class="t-radio__content"
+                      data-target="text"
+                      catch:tap="handleTap"
+                    >
+                      <wx-view
+                        class="t-radio__title t-class-label"
+                        style="-webkit-line-clamp:3"
+                      >
+                        
       选项四
       
-                                </wx-view>
-                                <wx-view
-                                  class="t-radio__description t-class-content "
-                                  style="-webkit-line-clamp:5"
-                                >
-                                  
-                                </wx-view>
-                              </wx-view>
-                              <wx-view
-                                class="t-radio__border t-class-border"
-                              />
-                            </wx-view>
-                          </t-radio>
-                        </wx-view>
-                        <wx-view
-                          id="id_option_5"
-                        >
-                          <t-radio
-                            class="t-dropdown-item__radio-item t-class-column-item"
-                            tabindex="0"
-                            tClass="radio"
-                            tClassLabel="t-class-column-item-label"
-                          >
-                            <wx-view
-                              ariaChecked="{{false}}"
-                              ariaDisabled="{{false}}"
-                              ariaLabel="选项五"
-                              ariaRole="radio"
-                              class="t-radio t-radio--block class t-class"
-                              disabled="{{false}}"
-                              style=""
-                              tabindex=""
-                              bind:tap="handleTap"
-                            >
-                              <wx-view
-                                class="t-radio__icon t-class-icon"
-                              >
-                                <wx-view
-                                  class="placeholder"
-                                />
-                              </wx-view>
-                              <wx-view
-                                class="t-radio__content"
-                                data-target="text"
-                                catch:tap="handleTap"
-                              >
-                                <wx-view
-                                  class="t-radio__title t-class-label"
-                                  style="-webkit-line-clamp:3"
-                                >
-                                  
+                      </wx-view>
+                      <wx-view
+                        class="t-radio__description t-class-content "
+                        style="-webkit-line-clamp:5"
+                      >
+                        
+                      </wx-view>
+                    </wx-view>
+                    <wx-view
+                      class="t-radio__border t-class-border"
+                    />
+                  </wx-view>
+                </wx-view>
+                <wx-view
+                  id="id_option_5"
+                >
+                  <wx-view
+                    ariaChecked="{{false}}"
+                    ariaDisabled="{{false}}"
+                    ariaLabel="选项五"
+                    ariaRole="radio"
+                    class="t-radio t-radio--block class t-class"
+                    disabled="{{false}}"
+                    style=""
+                    tabindex=""
+                    bind:tap="handleTap"
+                  >
+                    <wx-view
+                      class="t-radio__icon t-class-icon"
+                    >
+                      <wx-view
+                        class="placeholder"
+                      />
+                    </wx-view>
+                    <wx-view
+                      class="t-radio__content"
+                      data-target="text"
+                      catch:tap="handleTap"
+                    >
+                      <wx-view
+                        class="t-radio__title t-class-label"
+                        style="-webkit-line-clamp:3"
+                      >
+                        
       选项五
       
-                                </wx-view>
-                                <wx-view
-                                  class="t-radio__description t-class-content "
-                                  style="-webkit-line-clamp:5"
-                                >
-                                  
-                                </wx-view>
-                              </wx-view>
-                              <wx-view
-                                class="t-radio__border t-class-border"
-                              />
-                            </wx-view>
-                          </t-radio>
-                        </wx-view>
-                        <wx-view
-                          id="id_option_6"
-                        >
-                          <t-radio
-                            class="t-dropdown-item__radio-item t-class-column-item"
-                            tabindex="0"
-                            tClass="radio"
-                            tClassLabel="t-class-column-item-label"
-                          >
-                            <wx-view
-                              ariaChecked="{{false}}"
-                              ariaDisabled="{{false}}"
-                              ariaLabel="选项六"
-                              ariaRole="radio"
-                              class="t-radio t-radio--block class t-class"
-                              disabled="{{false}}"
-                              style=""
-                              tabindex=""
-                              bind:tap="handleTap"
-                            >
-                              <wx-view
-                                class="t-radio__icon t-class-icon"
-                              >
-                                <wx-view
-                                  class="placeholder"
-                                />
-                              </wx-view>
-                              <wx-view
-                                class="t-radio__content"
-                                data-target="text"
-                                catch:tap="handleTap"
-                              >
-                                <wx-view
-                                  class="t-radio__title t-class-label"
-                                  style="-webkit-line-clamp:3"
-                                >
-                                  
+                      </wx-view>
+                      <wx-view
+                        class="t-radio__description t-class-content "
+                        style="-webkit-line-clamp:5"
+                      >
+                        
+                      </wx-view>
+                    </wx-view>
+                    <wx-view
+                      class="t-radio__border t-class-border"
+                    />
+                  </wx-view>
+                </wx-view>
+                <wx-view
+                  id="id_option_6"
+                >
+                  <wx-view
+                    ariaChecked="{{false}}"
+                    ariaDisabled="{{false}}"
+                    ariaLabel="选项六"
+                    ariaRole="radio"
+                    class="t-radio t-radio--block class t-class"
+                    disabled="{{false}}"
+                    style=""
+                    tabindex=""
+                    bind:tap="handleTap"
+                  >
+                    <wx-view
+                      class="t-radio__icon t-class-icon"
+                    >
+                      <wx-view
+                        class="placeholder"
+                      />
+                    </wx-view>
+                    <wx-view
+                      class="t-radio__content"
+                      data-target="text"
+                      catch:tap="handleTap"
+                    >
+                      <wx-view
+                        class="t-radio__title t-class-label"
+                        style="-webkit-line-clamp:3"
+                      >
+                        
       选项六
       
-                                </wx-view>
-                                <wx-view
-                                  class="t-radio__description t-class-content "
-                                  style="-webkit-line-clamp:5"
-                                >
-                                  
-                                </wx-view>
-                              </wx-view>
-                              <wx-view
-                                class="t-radio__border t-class-border"
-                              />
-                            </wx-view>
-                          </t-radio>
-                        </wx-view>
-                        <wx-view
-                          id="id_option_7"
-                        >
-                          <t-radio
-                            class="t-dropdown-item__radio-item t-class-column-item"
-                            tabindex="0"
-                            tClass="radio"
-                            tClassLabel="t-class-column-item-label"
-                          >
-                            <wx-view
-                              ariaChecked="{{false}}"
-                              ariaDisabled="{{false}}"
-                              ariaLabel="选项七"
-                              ariaRole="radio"
-                              class="t-radio t-radio--block class t-class"
-                              disabled="{{false}}"
-                              style=""
-                              tabindex=""
-                              bind:tap="handleTap"
-                            >
-                              <wx-view
-                                class="t-radio__icon t-class-icon"
-                              >
-                                <wx-view
-                                  class="placeholder"
-                                />
-                              </wx-view>
-                              <wx-view
-                                class="t-radio__content"
-                                data-target="text"
-                                catch:tap="handleTap"
-                              >
-                                <wx-view
-                                  class="t-radio__title t-class-label"
-                                  style="-webkit-line-clamp:3"
-                                >
-                                  
+                      </wx-view>
+                      <wx-view
+                        class="t-radio__description t-class-content "
+                        style="-webkit-line-clamp:5"
+                      >
+                        
+                      </wx-view>
+                    </wx-view>
+                    <wx-view
+                      class="t-radio__border t-class-border"
+                    />
+                  </wx-view>
+                </wx-view>
+                <wx-view
+                  id="id_option_7"
+                >
+                  <wx-view
+                    ariaChecked="{{false}}"
+                    ariaDisabled="{{false}}"
+                    ariaLabel="选项七"
+                    ariaRole="radio"
+                    class="t-radio t-radio--block class t-class"
+                    disabled="{{false}}"
+                    style=""
+                    tabindex=""
+                    bind:tap="handleTap"
+                  >
+                    <wx-view
+                      class="t-radio__icon t-class-icon"
+                    >
+                      <wx-view
+                        class="placeholder"
+                      />
+                    </wx-view>
+                    <wx-view
+                      class="t-radio__content"
+                      data-target="text"
+                      catch:tap="handleTap"
+                    >
+                      <wx-view
+                        class="t-radio__title t-class-label"
+                        style="-webkit-line-clamp:3"
+                      >
+                        
       选项七
       
-                                </wx-view>
-                                <wx-view
-                                  class="t-radio__description t-class-content "
-                                  style="-webkit-line-clamp:5"
-                                >
-                                  
-                                </wx-view>
-                              </wx-view>
-                              <wx-view
-                                class="t-radio__border t-class-border"
-                              />
-                            </wx-view>
-                          </t-radio>
-                        </wx-view>
-                        <wx-view
-                          id="id_option_8"
-                        >
-                          <t-radio
-                            class="t-dropdown-item__radio-item t-class-column-item"
-                            tabindex="0"
-                            tClass="radio"
-                            tClassLabel="t-class-column-item-label"
-                          >
-                            <wx-view
-                              ariaChecked="{{false}}"
-                              ariaDisabled="{{false}}"
-                              ariaLabel="选项八"
-                              ariaRole="radio"
-                              class="t-radio t-radio--block class t-class"
-                              disabled="{{false}}"
-                              style=""
-                              tabindex=""
-                              bind:tap="handleTap"
-                            >
-                              <wx-view
-                                class="t-radio__icon t-class-icon"
-                              >
-                                <wx-view
-                                  class="placeholder"
-                                />
-                              </wx-view>
-                              <wx-view
-                                class="t-radio__content"
-                                data-target="text"
-                                catch:tap="handleTap"
-                              >
-                                <wx-view
-                                  class="t-radio__title t-class-label"
-                                  style="-webkit-line-clamp:3"
-                                >
-                                  
+                      </wx-view>
+                      <wx-view
+                        class="t-radio__description t-class-content "
+                        style="-webkit-line-clamp:5"
+                      >
+                        
+                      </wx-view>
+                    </wx-view>
+                    <wx-view
+                      class="t-radio__border t-class-border"
+                    />
+                  </wx-view>
+                </wx-view>
+                <wx-view
+                  id="id_option_8"
+                >
+                  <wx-view
+                    ariaChecked="{{false}}"
+                    ariaDisabled="{{false}}"
+                    ariaLabel="选项八"
+                    ariaRole="radio"
+                    class="t-radio t-radio--block class t-class"
+                    disabled="{{false}}"
+                    style=""
+                    tabindex=""
+                    bind:tap="handleTap"
+                  >
+                    <wx-view
+                      class="t-radio__icon t-class-icon"
+                    >
+                      <wx-view
+                        class="placeholder"
+                      />
+                    </wx-view>
+                    <wx-view
+                      class="t-radio__content"
+                      data-target="text"
+                      catch:tap="handleTap"
+                    >
+                      <wx-view
+                        class="t-radio__title t-class-label"
+                        style="-webkit-line-clamp:3"
+                      >
+                        
       选项八
       
-                                </wx-view>
-                                <wx-view
-                                  class="t-radio__description t-class-content "
-                                  style="-webkit-line-clamp:5"
-                                >
-                                  
-                                </wx-view>
-                              </wx-view>
-                              <wx-view
-                                class="t-radio__border t-class-border"
-                              />
-                            </wx-view>
-                          </t-radio>
-                        </wx-view>
-                        <wx-view
-                          id="id_disabled"
-                        >
-                          <t-radio
-                            class="t-dropdown-item__radio-item t-class-column-item"
-                            tabindex="0"
-                            tClass="radio"
-                            tClassLabel="t-class-column-item-label"
-                          >
-                            <wx-view
-                              ariaChecked="{{false}}"
-                              ariaDisabled="{{true}}"
-                              ariaLabel="禁用选项"
-                              ariaRole="radio"
-                              class="t-radio t-radio--block class t-class"
-                              disabled="{{true}}"
-                              style=""
-                              tabindex=""
-                              bind:tap="handleTap"
-                            >
-                              <wx-view
-                                class="t-radio__icon t-radio__icon--disabled t-class-icon"
-                              >
-                                <wx-view
-                                  class="placeholder"
-                                />
-                              </wx-view>
-                              <wx-view
-                                class="t-radio__content"
-                                data-target="text"
-                                catch:tap="handleTap"
-                              >
-                                <wx-view
-                                  class="t-radio__title t-radio__title--disabled t-class-label"
-                                  style="-webkit-line-clamp:3"
-                                >
-                                  
+                      </wx-view>
+                      <wx-view
+                        class="t-radio__description t-class-content "
+                        style="-webkit-line-clamp:5"
+                      >
+                        
+                      </wx-view>
+                    </wx-view>
+                    <wx-view
+                      class="t-radio__border t-class-border"
+                    />
+                  </wx-view>
+                </wx-view>
+                <wx-view
+                  id="id_disabled"
+                >
+                  <wx-view
+                    ariaChecked="{{false}}"
+                    ariaDisabled="{{true}}"
+                    ariaLabel="禁用选项"
+                    ariaRole="radio"
+                    class="t-radio t-radio--block class t-class"
+                    disabled="{{true}}"
+                    style=""
+                    tabindex=""
+                    bind:tap="handleTap"
+                  >
+                    <wx-view
+                      class="t-radio__icon t-radio__icon--disabled t-class-icon"
+                    >
+                      <wx-view
+                        class="placeholder"
+                      />
+                    </wx-view>
+                    <wx-view
+                      class="t-radio__content"
+                      data-target="text"
+                      catch:tap="handleTap"
+                    >
+                      <wx-view
+                        class="t-radio__title t-radio__title--disabled t-class-label"
+                        style="-webkit-line-clamp:3"
+                      >
+                        
       禁用选项
       
-                                </wx-view>
-                                <wx-view
-                                  class="t-radio__description t-radio__description--disabled t-class-content "
-                                  style="-webkit-line-clamp:5"
-                                >
-                                  
-                                </wx-view>
-                              </wx-view>
-                              <wx-view
-                                class="t-radio__border t-class-border"
-                              />
-                            </wx-view>
-                          </t-radio>
-                        </wx-view>
                       </wx-view>
-                    </t-radio-group>
-                  </wx-scroll-view>
+                      <wx-view
+                        class="t-radio__description t-radio__description--disabled t-class-content "
+                        style="-webkit-line-clamp:5"
+                      >
+                        
+                      </wx-view>
+                    </wx-view>
+                    <wx-view
+                      class="t-radio__border t-class-border"
+                    />
+                  </wx-view>
                 </wx-view>
-                <wx-view
-                  class="t-popup__close"
-                  bind:tap="handleClose"
-                />
               </wx-view>
-            </wx-view>
-            <t-overlay
-              id="popup-overlay"
-              bind:tap="handleOverlayClick"
-            >
-              <wx-view
-                ariaLabel="关闭"
-                ariaRole="button"
-                class="t-overlay t-fade-enter t-fade-enter-active class"
-                style="z-index:11000; position: absolute;"
-                bind:tap="handleClick"
-                catch:touchmove="noop"
-                bind:transitionend="onTransitionEnd"
-              />
-            </t-overlay>
-          </t-popup>
+            </wx-scroll-view>
+          </wx-view>
+          <wx-view
+            class="t-popup__close"
+            bind:tap="handleClose"
+          />
         </wx-view>
-      </t-dropdown-item>
-      <t-dropdown-item
-        id="second"
+      </wx-view>
+      <wx-view
+        ariaLabel="关闭"
+        ariaRole="button"
+        class="t-overlay t-fade-enter-active t-fade-enter-to class"
+        style="z-index:11000; position: absolute;"
+        bind:tap="handleClick"
+        catch:touchmove="noop"
+        bind:transitionend="onTransitionEnd"
       />
     </wx-view>
-  </t-dropdown-menu>
+  </wx-view>
 </main>
 `;
diff --git a/src/footer/__test__/__virtualHostSnapshot__/index.test.js.snap b/src/footer/__test__/__virtualHostSnapshot__/index.test.js.snap
index a75d29e0d..663b4673d 100644
--- a/src/footer/__test__/__virtualHostSnapshot__/index.test.js.snap
+++ b/src/footer/__test__/__virtualHostSnapshot__/index.test.js.snap
@@ -2,17 +2,15 @@
 
 exports[`Footer :base 1`] = `
 <main>
-  <main>
+  <wx-view
+    class="t-footer class t-class"
+    style=""
+  >
     <wx-view
-      class="t-footer class t-class"
-      style=""
+      class="t-footer__text"
     >
-      <wx-view
-        class="t-footer__text"
-      >
-        
-      </wx-view>
+      
     </wx-view>
-  </main>
+  </wx-view>
 </main>
 `;
diff --git a/src/image-viewer/__test__/__virtualHostSnapshot__/index.test.js.snap b/src/image-viewer/__test__/__virtualHostSnapshot__/index.test.js.snap
index d9a57a892..c361b1971 100644
--- a/src/image-viewer/__test__/__virtualHostSnapshot__/index.test.js.snap
+++ b/src/image-viewer/__test__/__virtualHostSnapshot__/index.test.js.snap
@@ -1,196 +1,115 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`image-viewer :base 1`] = `
-<t-image
-  class="t-image-viewer__image"
-  data-index="{{0}}"
-  tClass="t-image--external"
-  bind:load="onImageLoadSuccess"
+<wx-view
+  ariaHidden="{{false}}"
+  class="class t-class t-image t-image__mask t-image--loading t-image--shape-square"
+  style=""
 >
   <wx-view
-    ariaHidden="{{false}}"
-    class="class t-class t-image t-image__mask t-image--loading t-image--shape-square"
-    style=""
+    class="class t-class t-loading t-loading--horizontal"
+    style="width: 44rpx; height: 44rpx; color: inherit;"
   >
-    <t-loading
-      tClass="t-class-load"
-      tClassText="t-image--loading-text"
+    <wx-view
+      ariaLabel="加载中"
+      ariaRole="img"
+      class="t-class-indicator t-loading__spinner t-loading__spinner--dots "
+      style="width: 44rpx; height: 44rpx; color: inherit;  animation-duration: 0.8s; animation-play-state: running;"
     >
       <wx-view
-        class="class t-class t-loading t-loading--horizontal"
-        style="width: 44rpx; height: 44rpx; color: inherit;"
-      >
-        <wx-view
-          ariaLabel="加载中"
-          ariaRole="img"
-          class="t-class-indicator t-loading__spinner t-loading__spinner--dots "
-          style="width: 44rpx; height: 44rpx; color: inherit;  animation-duration: 0.8s; animation-play-state: running;"
-        >
-          <wx-view
-            class="t-loading__dot"
-            style="animation-duration: 0.8s; animation-delay:0s; animation-play-state: running;"
-          />
-          <wx-view
-            class="t-loading__dot"
-            style="animation-duration: 0.8s; animation-delay:0.26666666666666666s; animation-play-state: running;"
-          />
-          <wx-view
-            class="t-loading__dot"
-            style="animation-duration: 0.8s; animation-delay:0.5333333333333333s; animation-play-state: running;"
-          />
-        </wx-view>
-        <wx-view
-          ariaHidden="{{true}}"
-          ariaLabel=""
-          class="t-loading__text t-loading__text--horizontal t-class-text"
-        />
-      </wx-view>
-    </t-loading>
+        class="t-loading__dot"
+        style="animation-duration: 0.8s; animation-delay:0s; animation-play-state: running;"
+      />
+      <wx-view
+        class="t-loading__dot"
+        style="animation-duration: 0.8s; animation-delay:0.26666666666666666s; animation-play-state: running;"
+      />
+      <wx-view
+        class="t-loading__dot"
+        style="animation-duration: 0.8s; animation-delay:0.5333333333333333s; animation-play-state: running;"
+      />
+    </wx-view>
+    <wx-view
+      ariaHidden="{{true}}"
+      ariaLabel=""
+      class="t-loading__text t-loading__text--horizontal t-class-text"
+    />
   </wx-view>
-  <wx-image
-    ariaHidden="{{true}}"
-    ariaLabel=""
-    class="class t-class t-image t-image--shape-square"
-    hidden="{{true}}"
-    id="image"
-    lazyLoad="{{true}}"
-    mode="aspectFit"
-    showMenuByLongpress="{{false}}"
-    src="a.png"
-    style=""
-    webp="{{false}}"
-    bind:error="onLoadError"
-    bind:load="onLoaded"
-  />
-</t-image>
+</wx-view>
 `;
 
 exports[`image-viewer :base 2`] = `
-<t-image
-  class="t-image-viewer__image"
-  data-index="{{0}}"
-  tClass="t-image--external"
-  bind:load="onImageLoadSuccess"
+<wx-view
+  ariaHidden="{{false}}"
+  class="class t-class t-image t-image__mask t-image--loading t-image--shape-square"
+  style=""
 >
   <wx-view
-    ariaHidden="{{false}}"
-    class="class t-class t-image t-image__mask t-image--loading t-image--shape-square"
-    style=""
+    class="class t-class t-loading t-loading--horizontal"
+    style="width: 44rpx; height: 44rpx; color: inherit;"
   >
-    <t-loading
-      tClass="t-class-load"
-      tClassText="t-image--loading-text"
+    <wx-view
+      ariaLabel="加载中"
+      ariaRole="img"
+      class="t-class-indicator t-loading__spinner t-loading__spinner--dots "
+      style="width: 44rpx; height: 44rpx; color: inherit;  animation-duration: 0.8s; animation-play-state: running;"
     >
       <wx-view
-        class="class t-class t-loading t-loading--horizontal"
-        style="width: 44rpx; height: 44rpx; color: inherit;"
-      >
-        <wx-view
-          ariaLabel="加载中"
-          ariaRole="img"
-          class="t-class-indicator t-loading__spinner t-loading__spinner--dots "
-          style="width: 44rpx; height: 44rpx; color: inherit;  animation-duration: 0.8s; animation-play-state: running;"
-        >
-          <wx-view
-            class="t-loading__dot"
-            style="animation-duration: 0.8s; animation-delay:0s; animation-play-state: running;"
-          />
-          <wx-view
-            class="t-loading__dot"
-            style="animation-duration: 0.8s; animation-delay:0.26666666666666666s; animation-play-state: running;"
-          />
-          <wx-view
-            class="t-loading__dot"
-            style="animation-duration: 0.8s; animation-delay:0.5333333333333333s; animation-play-state: running;"
-          />
-        </wx-view>
-        <wx-view
-          ariaHidden="{{true}}"
-          ariaLabel=""
-          class="t-loading__text t-loading__text--horizontal t-class-text"
-        />
-      </wx-view>
-    </t-loading>
+        class="t-loading__dot"
+        style="animation-duration: 0.8s; animation-delay:0s; animation-play-state: running;"
+      />
+      <wx-view
+        class="t-loading__dot"
+        style="animation-duration: 0.8s; animation-delay:0.26666666666666666s; animation-play-state: running;"
+      />
+      <wx-view
+        class="t-loading__dot"
+        style="animation-duration: 0.8s; animation-delay:0.5333333333333333s; animation-play-state: running;"
+      />
+    </wx-view>
+    <wx-view
+      ariaHidden="{{true}}"
+      ariaLabel=""
+      class="t-loading__text t-loading__text--horizontal t-class-text"
+    />
   </wx-view>
-  <wx-image
-    ariaHidden="{{true}}"
-    ariaLabel=""
-    class="class t-class t-image t-image--shape-square"
-    hidden="{{true}}"
-    id="image"
-    lazyLoad="{{true}}"
-    mode="aspectFit"
-    showMenuByLongpress="{{false}}"
-    src="a.png"
-    style=""
-    webp="{{false}}"
-    bind:error="onLoadError"
-    bind:load="onLoaded"
-  />
-</t-image>
+</wx-view>
 `;
 
 exports[`image-viewer :base 3`] = `
-<t-image
-  class="t-image-viewer__image"
-  data-index="{{0}}"
-  tClass="t-image--external"
-  bind:load="onImageLoadSuccess"
+<wx-view
+  ariaHidden="{{false}}"
+  class="class t-class t-image t-image__mask t-image--loading t-image--shape-square"
+  style=""
 >
   <wx-view
-    ariaHidden="{{false}}"
-    class="class t-class t-image t-image__mask t-image--loading t-image--shape-square"
-    style=""
+    class="class t-class t-loading t-loading--horizontal"
+    style="width: 44rpx; height: 44rpx; color: inherit;"
   >
-    <t-loading
-      tClass="t-class-load"
-      tClassText="t-image--loading-text"
+    <wx-view
+      ariaLabel="加载中"
+      ariaRole="img"
+      class="t-class-indicator t-loading__spinner t-loading__spinner--dots "
+      style="width: 44rpx; height: 44rpx; color: inherit;  animation-duration: 0.8s; animation-play-state: running;"
     >
       <wx-view
-        class="class t-class t-loading t-loading--horizontal"
-        style="width: 44rpx; height: 44rpx; color: inherit;"
-      >
-        <wx-view
-          ariaLabel="加载中"
-          ariaRole="img"
-          class="t-class-indicator t-loading__spinner t-loading__spinner--dots "
-          style="width: 44rpx; height: 44rpx; color: inherit;  animation-duration: 0.8s; animation-play-state: running;"
-        >
-          <wx-view
-            class="t-loading__dot"
-            style="animation-duration: 0.8s; animation-delay:0s; animation-play-state: running;"
-          />
-          <wx-view
-            class="t-loading__dot"
-            style="animation-duration: 0.8s; animation-delay:0.26666666666666666s; animation-play-state: running;"
-          />
-          <wx-view
-            class="t-loading__dot"
-            style="animation-duration: 0.8s; animation-delay:0.5333333333333333s; animation-play-state: running;"
-          />
-        </wx-view>
-        <wx-view
-          ariaHidden="{{true}}"
-          ariaLabel=""
-          class="t-loading__text t-loading__text--horizontal t-class-text"
-        />
-      </wx-view>
-    </t-loading>
+        class="t-loading__dot"
+        style="animation-duration: 0.8s; animation-delay:0s; animation-play-state: running;"
+      />
+      <wx-view
+        class="t-loading__dot"
+        style="animation-duration: 0.8s; animation-delay:0.26666666666666666s; animation-play-state: running;"
+      />
+      <wx-view
+        class="t-loading__dot"
+        style="animation-duration: 0.8s; animation-delay:0.5333333333333333s; animation-play-state: running;"
+      />
+    </wx-view>
+    <wx-view
+      ariaHidden="{{true}}"
+      ariaLabel=""
+      class="t-loading__text t-loading__text--horizontal t-class-text"
+    />
   </wx-view>
-  <wx-image
-    ariaHidden="{{true}}"
-    ariaLabel=""
-    class="class t-class t-image t-image--shape-square"
-    hidden="{{true}}"
-    id="image"
-    lazyLoad="{{true}}"
-    mode="aspectFit"
-    showMenuByLongpress="{{false}}"
-    src="a.png"
-    style=""
-    webp="{{false}}"
-    bind:error="onLoadError"
-    bind:load="onLoaded"
-  />
-</t-image>
+</wx-view>
 `;
diff --git a/src/image/__test__/__virtualHostSnapshot__/index.test.js.snap b/src/image/__test__/__virtualHostSnapshot__/index.test.js.snap
index 445831548..73c7d73ee 100644
--- a/src/image/__test__/__virtualHostSnapshot__/index.test.js.snap
+++ b/src/image/__test__/__virtualHostSnapshot__/index.test.js.snap
@@ -2,72 +2,63 @@
 
 exports[`image :base 1`] = `
 <main>
-  <t-image>
+  <wx-view
+    ariaHidden="{{false}}"
+    class="class t-class t-image t-image__mask t-image--failed t-image--shape-square"
+    style=""
+  >
     <wx-view
-      ariaHidden="{{false}}"
-      class="class t-class t-image t-image__mask t-image--failed t-image--shape-square"
-      style=""
+      class="t-class-load"
+      style="font-size: 44rpx"
     >
       <wx-view
-        class="t-class-load"
-        style="font-size: 44rpx"
+        ariaHidden="{{false}}"
+        ariaLabel="加载失败"
+        ariaRole="img"
+        class="t-icon class t-class"
+        style=""
+        bind:tap="onTap"
       >
-        <t-icon>
-          <wx-view
-            ariaHidden="{{false}}"
-            ariaLabel="加载失败"
-            ariaRole="img"
-            class="t-icon class t-class"
-            style=""
-            bind:tap="onTap"
-          >
-            <wx-label
-              class="t-icon-close t-icon-base"
-            />
-          </wx-view>
-        </t-icon>
+        <wx-label
+          class="t-icon-close t-icon-base"
+        />
       </wx-view>
     </wx-view>
-    <wx-image
-      ariaHidden="{{true}}"
-      ariaLabel=""
-      class="class t-class t-image t-image--shape-square"
-      hidden="{{true}}"
-      id="image"
-      lazyLoad="{{false}}"
-      mode="scaleToFill"
-      showMenuByLongpress="{{false}}"
-      src=""
-      style=""
-      webp="{{false}}"
-      bind:error="onLoadError"
-      bind:load="onLoaded"
-    />
-  </t-image>
+  </wx-view>
+  <wx-image
+    ariaHidden="{{true}}"
+    ariaLabel=""
+    class="class t-class t-image t-image--shape-square"
+    hidden="{{true}}"
+    id="image"
+    lazyLoad="{{false}}"
+    mode="scaleToFill"
+    showMenuByLongpress="{{false}}"
+    src=""
+    style=""
+    webp="{{false}}"
+    bind:error="onLoadError"
+    bind:load="onLoaded"
+  />
 </main>
 `;
 
 exports[`image :success 1`] = `
 <main>
-  <t-image
-    id="root"
-    bind:load="handleLoad"
-  >
-    <wx-image
-      ariaHidden="{{false}}"
-      ariaLabel=""
-      class="class t-class t-image t-image--shape-square"
-      hidden="{{false}}"
-      id="image"
-      lazyLoad="{{false}}"
-      mode="heightFix"
-      showMenuByLongpress="{{false}}"
-      src="https://www.tencent.com/img/index/menu_logo.png"
-      style="height: 0px; width: 0.00px;"
-      webp="{{false}}"
-      bind:error="onLoadError"
-      bind:load="onLoaded"
-    />
-  </t-image>
+  <wx-image
+    ariaHidden="{{false}}"
+    ariaLabel=""
+    class="class t-class t-image t-image--shape-square"
+    hidden="{{false}}"
+    id="image"
+    lazyLoad="{{false}}"
+    mode="heightFix"
+    showMenuByLongpress="{{false}}"
+    src="https://www.tencent.com/img/index/menu_logo.png"
+    style="height: 0px; width: 0.00px;"
+    webp="{{false}}"
+    bind:error="onLoadError"
+    bind:load="onLoaded"
+  />
 </main>
 `;
diff --git a/src/input/__test__/__virtualHostSnapshot__/index.test.js.snap b/src/input/__test__/__virtualHostSnapshot__/index.test.js.snap
index 2b1c4656a..595e9792e 100644
--- a/src/input/__test__/__virtualHostSnapshot__/index.test.js.snap
+++ b/src/input/__test__/__virtualHostSnapshot__/index.test.js.snap
@@ -1,218 +1,198 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`input props : clearable && label && suffix 1`] = `
-<t-input
-  class="base"
+<wx-view
+  ariaDescribedby="{{true}}"
+  class="t-input t-input--border t-input--layout-horizontal class t-class"
+  style=""
 >
   <wx-view
-    ariaDescribedby="{{true}}"
-    class="t-input t-input--border t-input--layout-horizontal class t-class"
-    style=""
+    class="t-input__wrap--prefix"
   >
     <wx-view
-      class="t-input__wrap--prefix"
+      class="t-input__icon--prefix"
+    />
+    <wx-view
+      ariaHidden="{{true}}"
+      class="t-input__label"
     >
-      <wx-view
-        class="t-input__icon--prefix"
-      />
-      <wx-view
-        ariaHidden="{{true}}"
-        class="t-input__label"
+      <wx-text
+        class="t-class-label"
       >
-        <wx-text
-          class="t-class-label"
-        >
-          tdesign
-        </wx-text>
-      </wx-view>
+        tdesign
+      </wx-text>
     </wx-view>
+  </wx-view>
+  <wx-view
+    class="t-input__wrap"
+  >
     <wx-view
-      class="t-input__wrap"
+      class="t-input__content t-input--default"
     >
+      <wx-input
+        adjustPosition="{{true}}"
+        alwaysEmbed="{{false}}"
+        ariaLabel="tdesign"
+        ariaRole="textbox"
+        ariaRoledescription="tdesign"
+        autoFocus="{{false}}"
+        class="t-input__control t-input--left t-class-input"
+        confirmHold="{{false}}"
+        confirmType="done"
+        cursor="{{0}}"
+        cursorSpacing="{{0}}"
+        disabled="{{false}}"
+        focus="{{false}}"
+        holdKeyboard="{{false}}"
+        maxlength="{{-1}}"
+        password="{{false}}"
+        placeholder=""
+        placeholderClass="t-input__placeholder input-placeholder"
+        placeholderStyle=""
+        safePasswordCertPath=""
+        safePasswordCustomHash=""
+        safePasswordLength="{{0}}"
+        safePasswordNonce=""
+        safePasswordSalt=""
+        safePasswordTimeStamp="{{0}}"
+        selectionEnd="{{-1}}"
+        selectionStart="{{-1}}"
+        type="text"
+        value="input输入框"
+        bind:blur="onBlur"
+        bind:confirm="onConfirm"
+        bind:focus="onFocus"
+        bind:input="onInput"
+        bind:keyboardheightchange="onKeyboardHeightChange"
+        bind:nicknamereview="onNickNameReview"
+      />
       <wx-view
-        class="t-input__content t-input--default"
+        class="t-input__wrap--clearable-icon"
+        bind:touchstart="clearInput"
       >
-        <wx-input
-          adjustPosition="{{true}}"
-          alwaysEmbed="{{false}}"
-          ariaLabel="tdesign"
-          ariaRole="textbox"
-          ariaRoledescription="tdesign"
-          autoFocus="{{false}}"
-          class="t-input__control t-input--left t-class-input"
-          confirmHold="{{false}}"
-          confirmType="done"
-          cursor="{{0}}"
-          cursorSpacing="{{0}}"
-          disabled="{{false}}"
-          focus="{{false}}"
-          holdKeyboard="{{false}}"
-          maxlength="{{-1}}"
-          password="{{false}}"
-          placeholder=""
-          placeholderClass="t-input__placeholder input-placeholder"
-          placeholderStyle=""
-          safePasswordCertPath=""
-          safePasswordCustomHash=""
-          safePasswordLength="{{0}}"
-          safePasswordNonce=""
-          safePasswordSalt=""
-          safePasswordTimeStamp="{{0}}"
-          selectionEnd="{{-1}}"
-          selectionStart="{{-1}}"
-          type="text"
-          value="input输入框"
-          bind:blur="onBlur"
-          bind:confirm="onConfirm"
-          bind:focus="onFocus"
-          bind:input="onInput"
-          bind:keyboardheightchange="onKeyboardHeightChange"
-          bind:nicknamereview="onNickNameReview"
-        />
-        <wx-view
-          class="t-input__wrap--clearable-icon"
-          bind:touchstart="clearInput"
-        >
-          <t-icon
-            class=""
-            tClass="t-class-clearable"
-            bind:click=""
-          >
-            <wx-view
-              ariaHidden="{{false}}"
-              ariaLabel="清除"
-              ariaRole="button"
-              class="t-icon class t-class"
-              style=""
-              bind:tap="onTap"
-            >
-              <wx-label
-                class="t-icon-close-circle-filled t-icon-base"
-              />
-            </wx-view>
-          </t-icon>
-        </wx-view>
         <wx-view
-          class="t-input__wrap--suffix t-class-suffix"
-          bind:tap="onSuffixClick"
+          ariaHidden="{{false}}"
+          ariaLabel="清除"
+          ariaRole="button"
+          class="t-icon class t-class"
+          style=""
+          bind:tap="onTap"
         >
-          <wx-text>
-            后置内容
-          </wx-text>
+          <wx-label
+            class="t-icon-close-circle-filled t-icon-base"
+          />
         </wx-view>
+      </wx-view>
+      <wx-view
+        class="t-input__wrap--suffix t-class-suffix"
+        bind:tap="onSuffixClick"
+      >
+        <wx-text>
+          后置内容
+        </wx-text>
+      </wx-view>
+      <wx-view
+        class="t-input__wrap--suffix-icon"
+        bind:tap="onSuffixIconClick"
+      >
         <wx-view
-          class="t-input__wrap--suffix-icon"
-          bind:tap="onSuffixIconClick"
+          ariaHidden="{{false}}"
+          ariaLabel=""
+          ariaRole="button"
+          class="t-icon class t-class"
+          style=""
+          bind:tap="onTap"
         >
-          <t-icon
-            class=""
-            tClass="t-class-suffix-icon"
-            bind:click=""
-          >
-            <wx-view
-              ariaHidden="{{false}}"
-              ariaLabel=""
-              ariaRole="button"
-              class="t-icon class t-class"
-              style=""
-              bind:tap="onTap"
-            >
-              <wx-label
-                class="t-icon-app t-icon-base"
-              />
-            </wx-view>
-          </t-icon>
+          <wx-label
+            class="t-icon-app t-icon-base"
+          />
         </wx-view>
       </wx-view>
     </wx-view>
   </wx-view>
-</t-input>
+</wx-view>
 `;
 
 exports[`input slots : label 1`] = `
-<t-input
-  class="base"
+<wx-view
+  ariaDescribedby="{{true}}"
+  class="t-input t-input--border t-input--layout-horizontal class t-class"
+  style=""
 >
   <wx-view
-    ariaDescribedby="{{true}}"
-    class="t-input t-input--border t-input--layout-horizontal class t-class"
-    style=""
+    class="t-input__wrap--prefix"
   >
     <wx-view
-      class="t-input__wrap--prefix"
+      class="t-input__icon--prefix"
+    />
+    <wx-view
+      ariaHidden="{{true}}"
+      class="t-input__label"
     >
-      <wx-view
-        class="t-input__icon--prefix"
-      />
-      <wx-view
-        ariaHidden="{{true}}"
-        class="t-input__label"
+      <wx-text
+        slot="label"
       >
+        标签文字
         <wx-text
-          slot="label"
+          style="color: #e34d59"
         >
-          标签文字
-          <wx-text
-            style="color: #e34d59"
-          >
-            *
-          </wx-text>
+          *
         </wx-text>
-      </wx-view>
+      </wx-text>
     </wx-view>
+  </wx-view>
+  <wx-view
+    class="t-input__wrap"
+  >
     <wx-view
-      class="t-input__wrap"
+      class="t-input__content t-input--default"
     >
+      <wx-input
+        adjustPosition="{{true}}"
+        alwaysEmbed="{{false}}"
+        ariaLabel=""
+        ariaRole="textbox"
+        ariaRoledescription=""
+        autoFocus="{{false}}"
+        class="t-input__control t-input--left t-class-input"
+        confirmHold="{{false}}"
+        confirmType="done"
+        cursor="{{0}}"
+        cursorSpacing="{{0}}"
+        disabled="{{false}}"
+        focus="{{false}}"
+        holdKeyboard="{{false}}"
+        maxlength="{{-1}}"
+        password="{{false}}"
+        placeholder=""
+        placeholderClass="t-input__placeholder input-placeholder"
+        placeholderStyle=""
+        safePasswordCertPath=""
+        safePasswordCustomHash=""
+        safePasswordLength="{{0}}"
+        safePasswordNonce=""
+        safePasswordSalt=""
+        safePasswordTimeStamp="{{0}}"
+        selectionEnd="{{-1}}"
+        selectionStart="{{-1}}"
+        type="text"
+        value=""
+        bind:blur="onBlur"
+        bind:confirm="onConfirm"
+        bind:focus="onFocus"
+        bind:input="onInput"
+        bind:keyboardheightchange="onKeyboardHeightChange"
+        bind:nicknamereview="onNickNameReview"
+      />
       <wx-view
-        class="t-input__content t-input--default"
-      >
-        <wx-input
-          adjustPosition="{{true}}"
-          alwaysEmbed="{{false}}"
-          ariaLabel=""
-          ariaRole="textbox"
-          ariaRoledescription=""
-          autoFocus="{{false}}"
-          class="t-input__control t-input--left t-class-input"
-          confirmHold="{{false}}"
-          confirmType="done"
-          cursor="{{0}}"
-          cursorSpacing="{{0}}"
-          disabled="{{false}}"
-          focus="{{false}}"
-          holdKeyboard="{{false}}"
-          maxlength="{{-1}}"
-          password="{{false}}"
-          placeholder=""
-          placeholderClass="t-input__placeholder input-placeholder"
-          placeholderStyle=""
-          safePasswordCertPath=""
-          safePasswordCustomHash=""
-          safePasswordLength="{{0}}"
-          safePasswordNonce=""
-          safePasswordSalt=""
-          safePasswordTimeStamp="{{0}}"
-          selectionEnd="{{-1}}"
-          selectionStart="{{-1}}"
-          type="text"
-          value=""
-          bind:blur="onBlur"
-          bind:confirm="onConfirm"
-          bind:focus="onFocus"
-          bind:input="onInput"
-          bind:keyboardheightchange="onKeyboardHeightChange"
-          bind:nicknamereview="onNickNameReview"
-        />
-        <wx-view
-          class="t-input__wrap--suffix t-class-suffix"
-          bind:tap="onSuffixClick"
-        />
-        <wx-view
-          class="t-input__wrap--suffix-icon"
-          bind:tap="onSuffixIconClick"
-        />
-      </wx-view>
+        class="t-input__wrap--suffix t-class-suffix"
+        bind:tap="onSuffixClick"
+      />
+      <wx-view
+        class="t-input__wrap--suffix-icon"
+        bind:tap="onSuffixIconClick"
+      />
     </wx-view>
   </wx-view>
-</t-input>
+</wx-view>
 `;
diff --git a/src/message/__test__/__virtualHostSnapshot__/index.test.js.snap b/src/message/__test__/__virtualHostSnapshot__/index.test.js.snap
index 67aa8f6c8..8d7f31dc6 100644
--- a/src/message/__test__/__virtualHostSnapshot__/index.test.js.snap
+++ b/src/message/__test__/__virtualHostSnapshot__/index.test.js.snap
@@ -2,98 +2,82 @@
 
 exports[`message props : style && customStyle 1`] = `
 <main>
-  <t-message
+  <wx-view
+    animation="{{
+      Object {
+        "actions": Array [
+          Object {
+            "animates": Array [
+              Object {
+                "args": Array [
+                  66,
+                ],
+                "type": "translateY",
+              },
+            ],
+            "option": Object {
+              "transformOrigin": "50% 50% 0",
+              "transition": Object {
+                "delay": 0,
+                "duration": 500,
+                "timingFunction": "ease",
+              },
+            },
+          },
+        ],
+      }
+    }}"
+    ariaRole="alert"
+    class="t-message class t-class t-message--warning"
     id="t-message"
+    style="z-index:15000;top:-92rpx;right:32rpx;left:32rpx; color: red; font-size: 9px;"
   >
     <wx-view
-      animation="{{
-        Object {
-          "actions": Array [
-            Object {
-              "animates": Array [
-                Object {
-                  "args": Array [
-                    66,
-                  ],
-                  "type": "translateY",
-                },
-              ],
-              "option": Object {
-                "transformOrigin": "50% 50% 0",
-                "transition": Object {
-                  "delay": 0,
-                  "duration": 500,
-                  "timingFunction": "ease",
-                },
-              },
-            },
-          ],
-        }
-      }}"
-      ariaRole="alert"
-      class="t-message class t-class t-message--warning"
-      id="t-message"
-      style="z-index:15000;top:-92rpx;right:32rpx;left:32rpx; color: red; font-size: 9px;"
+      class="t-message__icon--left"
     >
       <wx-view
-        class="t-message__icon--left"
+        ariaHidden="{{true}}"
+        ariaLabel=""
+        ariaRole=""
+        class="t-icon class t-class"
+        style=""
+        bind:tap="onTap"
       >
-        <t-icon
-          class=""
-          tClass="t-class-icon"
-          bind:click=""
-        >
-          <wx-view
-            ariaHidden="{{true}}"
-            ariaLabel=""
-            ariaRole=""
-            class="t-icon class t-class"
-            style=""
-            bind:tap="onTap"
-          >
-            <wx-label
-              class="t-icon-info-circle-filled t-icon-base"
-            />
-          </wx-view>
-        </t-icon>
+        <wx-label
+          class="t-icon-info-circle-filled t-icon-base"
+        />
       </wx-view>
+    </wx-view>
+    <wx-view
+      class="t-message__text-wrap "
+      id="t-message__text-wrap"
+      style="text-align: left"
+    >
       <wx-view
-        class="t-message__text-wrap "
-        id="t-message__text-wrap"
-        style="text-align: left"
+        animation="{{Array []}}"
+        class="t-message__text t-class-content"
+        id="t-message__text"
       >
-        <wx-view
-          animation="{{Array []}}"
-          class="t-message__text t-class-content"
-          id="t-message__text"
-        >
-          这是一条带关闭的消息通知
-        </wx-view>
+        这是一条带关闭的消息通知
       </wx-view>
+    </wx-view>
+    <wx-view
+      class="t-message__icon--right"
+      bind:tap="handleClose"
+    >
       <wx-view
-        class="t-message__icon--right"
-        bind:tap="handleClose"
+        ariaHidden="{{false}}"
+        ariaLabel="关闭"
+        ariaRole="button"
+        class="t-icon class t-class"
+        style=""
+        bind:tap="onTap"
       >
-        <t-icon
-          class=""
-          tClass="t-class-close-btn"
-          bind:click=""
-        >
-          <wx-view
-            ariaHidden="{{false}}"
-            ariaLabel="关闭"
-            ariaRole="button"
-            class="t-icon class t-class"
-            style=""
-            bind:tap="onTap"
-          >
-            <wx-label
-              class="t-icon-close t-icon-base"
-            />
-          </wx-view>
-        </t-icon>
+        <wx-label
+          class="t-icon-close t-icon-base"
+        />
       </wx-view>
     </wx-view>
-  </t-message>
+  </wx-view>
 </main>
 `;
diff --git a/src/navbar/__test__/__virtualHostSnapshot__/index.test.js.snap b/src/navbar/__test__/__virtualHostSnapshot__/index.test.js.snap
index 198a82e20..282b0277a 100644
--- a/src/navbar/__test__/__virtualHostSnapshot__/index.test.js.snap
+++ b/src/navbar/__test__/__virtualHostSnapshot__/index.test.js.snap
@@ -2,175 +2,165 @@
 
 exports[`navbar :base 1`] = `
 <main>
-  <t-navbar>
+  <wx-view
+    class="t-navbar t-navbar--fixed t-navbar--visible-animation class t-class"
+    style=""
+  >
     <wx-view
-      class="t-navbar t-navbar--fixed t-navbar--visible-animation class t-class"
-      style=""
+      class="t-navbar__placeholder"
+    />
+    <wx-view
+      class="t-navbar__content"
     >
       <wx-view
-        class="t-navbar__placeholder"
-      />
-      <wx-view
-        class="t-navbar__content"
+        class="t-navbar__left t-class-left"
       >
         <wx-view
-          class="t-navbar__left t-class-left"
-        >
-          <wx-view
-            class="t-navbar__capsule t-class-capsule"
-          />
-        </wx-view>
-        <wx-view
-          class="t-navbar__center t-class-center"
+          class="t-navbar__capsule t-class-capsule"
+        />
+      </wx-view>
+      <wx-view
+        class="t-navbar__center t-class-center"
+      >
+        <wx-text
+          class="t-navbar__center-title t-class-title"
         >
-          <wx-text
-            class="t-navbar__center-title t-class-title"
-          >
-            test
-          </wx-text>
-        </wx-view>
+          test
+        </wx-text>
       </wx-view>
     </wx-view>
-  </t-navbar>
+  </wx-view>
 </main>
 `;
 
 exports[`navbar :base 2`] = `
 <main>
-  <t-navbar>
+  <wx-view
+    class="t-navbar t-navbar--fixed t-navbar--hide-animation class t-class"
+    style=""
+  >
     <wx-view
-      class="t-navbar t-navbar--fixed t-navbar--hide-animation class t-class"
-      style=""
+      class="t-navbar__placeholder"
+    />
+    <wx-view
+      class="t-navbar__content"
     >
       <wx-view
-        class="t-navbar__placeholder"
-      />
-      <wx-view
-        class="t-navbar__content"
+        class="t-navbar__left t-class-left"
       >
         <wx-view
-          class="t-navbar__left t-class-left"
-        >
-          <wx-view
-            class="t-navbar__capsule t-class-capsule"
-          />
-        </wx-view>
-        <wx-view
-          class="t-navbar__center t-class-center"
+          class="t-navbar__capsule t-class-capsule"
+        />
+      </wx-view>
+      <wx-view
+        class="t-navbar__center t-class-center"
+      >
+        <wx-text
+          class="t-navbar__center-title t-class-title"
         >
-          <wx-text
-            class="t-navbar__center-title t-class-title"
-          >
-            test
-          </wx-text>
-        </wx-view>
+          test
+        </wx-text>
       </wx-view>
     </wx-view>
-  </t-navbar>
+  </wx-view>
 </main>
 `;
 
 exports[`navbar :base 3`] = `
 <main>
-  <t-navbar>
+  <wx-view
+    class="t-navbar t-navbar--fixed t-navbar--hide class t-class"
+    style=""
+  >
     <wx-view
-      class="t-navbar t-navbar--fixed t-navbar--hide class t-class"
-      style=""
+      class="t-navbar__placeholder"
+    />
+    <wx-view
+      class="t-navbar__content"
     >
       <wx-view
-        class="t-navbar__placeholder"
-      />
-      <wx-view
-        class="t-navbar__content"
+        class="t-navbar__left t-class-left"
       >
         <wx-view
-          class="t-navbar__left t-class-left"
-        >
-          <wx-view
-            class="t-navbar__capsule t-class-capsule"
-          />
-        </wx-view>
-        <wx-view
-          class="t-navbar__center t-class-center"
+          class="t-navbar__capsule t-class-capsule"
+        />
+      </wx-view>
+      <wx-view
+        class="t-navbar__center t-class-center"
+      >
+        <wx-text
+          class="t-navbar__center-title t-class-title"
         >
-          <wx-text
-            class="t-navbar__center-title t-class-title"
-          >
-            test
-          </wx-text>
-        </wx-view>
+          test
+        </wx-text>
       </wx-view>
     </wx-view>
-  </t-navbar>
+  </wx-view>
 </main>
 `;
 
 exports[`navbar :fixed 1`] = `
 <main>
-  <t-navbar>
+  <wx-view
+    class="t-navbar t-navbar--fixed t-navbar--visible-animation class t-class"
+    style=""
+  >
     <wx-view
-      class="t-navbar t-navbar--fixed t-navbar--visible-animation class t-class"
-      style=""
+      class="t-navbar__placeholder"
+    />
+    <wx-view
+      class="t-navbar__content"
     >
       <wx-view
-        class="t-navbar__placeholder"
-      />
-      <wx-view
-        class="t-navbar__content"
+        class="t-navbar__left t-class-left"
       >
         <wx-view
-          class="t-navbar__left t-class-left"
-        >
-          <wx-view
-            class="t-navbar__capsule t-class-capsule"
-          />
-        </wx-view>
-        <wx-view
-          class="t-navbar__center t-class-center"
+          class="t-navbar__capsule t-class-capsule"
+        />
+      </wx-view>
+      <wx-view
+        class="t-navbar__center t-class-center"
+      >
+        <wx-text
+          class="t-navbar__center-title t-class-title"
         >
-          <wx-text
-            class="t-navbar__center-title t-class-title"
-          >
-            test
-          </wx-text>
-        </wx-view>
+          test
+        </wx-text>
       </wx-view>
     </wx-view>
-  </t-navbar>
+  </wx-view>
 </main>
 `;
 
 exports[`navbar :menu button 1`] = `
 <main>
-  <t-navbar>
+  <wx-view
+    class="t-navbar t-navbar--fixed  class t-class"
+    style="--td-navbar-padding-top:20px; --td-navbar-right:414px; --td-navbar-capsule-height: 10px; --td-navbar-capsule-width: 40px; --td-navbar-height: -10px;"
+  >
+    <wx-view
+      class="t-navbar__placeholder"
+    />
     <wx-view
-      class="t-navbar t-navbar--fixed  class t-class"
-      style="--td-navbar-padding-top:20px; --td-navbar-right:414px; --td-navbar-capsule-height: 10px; --td-navbar-capsule-width: 40px; --td-navbar-height: -10px;"
+      class="t-navbar__content"
     >
       <wx-view
-        class="t-navbar__placeholder"
-      />
-      <wx-view
-        class="t-navbar__content"
+        class="t-navbar__left t-class-left"
       >
         <wx-view
-          class="t-navbar__left t-class-left"
-        >
-          <wx-view
-            class="t-navbar__capsule t-class-capsule"
-          />
-        </wx-view>
-        <wx-view
-          class="t-navbar__center t-class-center"
+          class="t-navbar__capsule t-class-capsule"
+        />
+      </wx-view>
+      <wx-view
+        class="t-navbar__center t-class-center"
+      >
+        <wx-text
+          class="t-navbar__center-title t-class-title"
         >
-          <wx-text
-            class="t-navbar__center-title t-class-title"
-          >
-            test
-          </wx-text>
-        </wx-view>
+          test
+        </wx-text>
       </wx-view>
     </wx-view>
-  </t-navbar>
+  </wx-view>
 </main>
 `;
diff --git a/src/notice-bar/__test__/__virtualHostSnapshot__/index.test.js.snap b/src/notice-bar/__test__/__virtualHostSnapshot__/index.test.js.snap
index 7dd7671db..e190e8a3e 100644
--- a/src/notice-bar/__test__/__virtualHostSnapshot__/index.test.js.snap
+++ b/src/notice-bar/__test__/__virtualHostSnapshot__/index.test.js.snap
@@ -2,79 +2,69 @@
 
 exports[`notice-bar props : marquee 1`] = `
 <main>
-  <t-notice-bar
-    class="base"
+  <wx-view
+    class="t-notice-bar t-notice-bar--info class t-class"
+    style=""
   >
     <wx-view
-      class="t-notice-bar t-notice-bar--info class t-class"
-      style=""
+      class="t-notice-bar__prefix-icon"
+      bind:tap="clickPrefixIcon"
     >
       <wx-view
-        class="t-notice-bar__prefix-icon"
-        bind:tap="clickPrefixIcon"
+        ariaHidden="{{false}}"
+        ariaLabel=""
+        ariaRole=""
+        class="t-icon class t-class"
+        style=""
+        bind:tap="onTap"
       >
-        <t-icon
-          class=""
-          tClass="t-class-prefix-icon"
-          bind:click=""
-        >
-          <wx-view
-            ariaHidden="{{false}}"
-            ariaLabel=""
-            ariaRole=""
-            class="t-icon class t-class"
-            style=""
-            bind:tap="onTap"
-          >
-            <wx-label
-              class="t-icon-info-circle-filled t-icon-base"
-            />
-          </wx-view>
-        </t-icon>
+        <wx-label
+          class="t-icon-info-circle-filled t-icon-base"
+        />
       </wx-view>
+    </wx-view>
+    <wx-view
+      class="t-notice-bar__content-wrap"
+      bind:tap="clickContent"
+    >
       <wx-view
-        class="t-notice-bar__content-wrap"
-        bind:tap="clickContent"
-      >
-        <wx-view
-          animation="{{
-            Object {
-              "actions": Array [
-                Object {
-                  "animates": Array [
-                    Object {
-                      "args": Array [
-                        -350,
-                      ],
-                      "type": "translateX",
-                    },
-                  ],
-                  "option": Object {
-                    "transformOrigin": "50% 50% 0",
-                    "transition": Object {
-                      "delay": 0,
-                      "duration": 8287.5,
-                      "timingFunction": "linear",
-                    },
+        animation="{{
+          Object {
+            "actions": Array [
+              Object {
+                "animates": Array [
+                  Object {
+                    "args": Array [
+                      -350,
+                    ],
+                    "type": "translateX",
+                  },
+                ],
+                "option": Object {
+                  "transformOrigin": "50% 50% 0",
+                  "transition": Object {
+                    "delay": 0,
+                    "duration": 8287.5,
+                    "timingFunction": "linear",
                   },
                 },
-              ],
-            }
-          }}"
-          class="t-notice-bar__content t-class-content "
-        >
-          提示文字描述提示文字描述提示文字描述提示文字描述文
-          <wx-view
-            class="t-notice-bar__operation t-class-operation"
-            catch:tap="clickOperation"
-          />
-        </wx-view>
+              },
+            ],
+          }
+        }}"
+        class="t-notice-bar__content t-class-content "
+      >
+        提示文字描述提示文字描述提示文字描述提示文字描述文
+        <wx-view
+          class="t-notice-bar__operation t-class-operation"
+          catch:tap="clickOperation"
+        />
       </wx-view>
-      <wx-view
-        class="t-notice-bar__suffix-icon"
-        bind:tap="clickSuffixIcon"
-      />
     </wx-view>
-  </t-notice-bar>
+    <wx-view
+      class="t-notice-bar__suffix-icon"
+      bind:tap="clickSuffixIcon"
+    />
+  </wx-view>
 </main>
 `;
diff --git a/src/overlay/__test__/__virtualHostSnapshot__/index.test.js.snap b/src/overlay/__test__/__virtualHostSnapshot__/index.test.js.snap
index 7a06bb8be..3288499cb 100644
--- a/src/overlay/__test__/__virtualHostSnapshot__/index.test.js.snap
+++ b/src/overlay/__test__/__virtualHostSnapshot__/index.test.js.snap
@@ -2,16 +2,14 @@
 
 exports[`overlay :base 1`] = `
 <main>
-  <t-overlay>
-    <wx-view
-      ariaLabel="关闭"
-      ariaRole="button"
-      class="t-overlay t-fade-enter t-fade-enter-active class"
-      style="z-index:11000;"
-      bind:tap="handleClick"
-      catch:touchmove="noop"
-      bind:transitionend="onTransitionEnd"
-    />
-  </t-overlay>
+  <wx-view
+    ariaLabel="关闭"
+    ariaRole="button"
+    class="t-overlay t-fade-enter t-fade-enter-active class"
+    style="z-index:11000;"
+    bind:tap="handleClick"
+    catch:touchmove="noop"
+    bind:transitionend="onTransitionEnd"
+  />
 </main>
 `;
diff --git a/src/picker/__test__/__virtualHostSnapshot__/index.test.js.snap b/src/picker/__test__/__virtualHostSnapshot__/index.test.js.snap
index 99a15b9d9..4fa9f7066 100644
--- a/src/picker/__test__/__virtualHostSnapshot__/index.test.js.snap
+++ b/src/picker/__test__/__virtualHostSnapshot__/index.test.js.snap
@@ -1,175 +1,144 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`picker :base 1`] = `
-<t-picker
-  data-key="yearSeasons"
-  id="yearSeasons"
-  bind:cancel="onPickerCancel"
-  bind:change="onPickerChange"
-  bind:pick="onColumnChange"
+<wx-view
+  ariaModal="{{true}}"
+  ariaRole="dialog"
+  class="t-popup t-popup--bottom t-fade-enter t-fade-enter-active class t-class"
+  style="z-index:11500;"
+  bind:transitionend="onTransitionEnd"
 >
-  <t-popup
-    class="class"
-    bind:visible-change="onPopupChange"
+  <wx-view
+    class="t-popup__content t-class-content"
   >
     <wx-view
-      ariaModal="{{true}}"
-      ariaRole="dialog"
-      class="t-popup t-popup--bottom t-fade-enter t-fade-enter-active class t-class"
-      style="z-index:11500;"
-      bind:transitionend="onTransitionEnd"
+      class="t-picker t-class"
+      slot="content"
+      style=""
     >
       <wx-view
-        class="t-popup__content t-class-content"
+        class="t-picker__toolbar"
       >
         <wx-view
-          class="t-picker t-class"
-          slot="content"
+          class="t-picker__cancel t-class-cancel"
+          bind:tap="onCancel"
+        >
+          取消
+        </wx-view>
+        <wx-view
+          class="t-picker__title t-class-title"
+        >
+          
+        </wx-view>
+        <wx-view
+          class="t-picker__confirm t-class-confirm"
+          bind:tap="onConfirm"
+        >
+          确认
+        </wx-view>
+      </wx-view>
+      <wx-view
+        class="t-picker__main"
+      >
+        <wx-view
+          class="t-picker-item__group class t-class"
           style=""
+          bind:touchcancel="onTouchEnd"
+          bind:touchend="onTouchEnd"
+          catch:touchmove="onTouchMove"
+          bind:touchstart="onTouchStart"
         >
           <wx-view
-            class="t-picker__toolbar"
+            class="t-picker-item__wrapper"
+            style="transition: transform 0ms cubic-bezier(0.215, 0.61, 0.355, 1); transform: translate3d(0, 0px, 0)"
           >
             <wx-view
-              class="t-picker__cancel t-class-cancel"
-              bind:tap="onCancel"
+              class="t-picker-item__item t-picker-item__item--active"
+              data-index="{{0}}"
             >
-              取消
+              
+      2021年
+    
             </wx-view>
             <wx-view
-              class="t-picker__title t-class-title"
+              class="t-picker-item__item"
+              data-index="{{1}}"
             >
               
+      2020年
+    
             </wx-view>
             <wx-view
-              class="t-picker__confirm t-class-confirm"
-              bind:tap="onConfirm"
+              class="t-picker-item__item"
+              data-index="{{2}}"
             >
-              确认
+              
+      2019年
+    
             </wx-view>
           </wx-view>
+        </wx-view>
+        <wx-view
+          class="t-picker-item__group class t-class"
+          style=""
+          bind:touchcancel="onTouchEnd"
+          bind:touchend="onTouchEnd"
+          catch:touchmove="onTouchMove"
+          bind:touchstart="onTouchStart"
+        >
           <wx-view
-            class="t-picker__main"
+            class="t-picker-item__wrapper"
+            style="transition: transform 0ms cubic-bezier(0.215, 0.61, 0.355, 1); transform: translate3d(0, 0px, 0)"
           >
-            <t-picker-item>
-              <wx-view
-                class="t-picker-item__group class t-class"
-                style=""
-                bind:touchcancel="onTouchEnd"
-                bind:touchend="onTouchEnd"
-                catch:touchmove="onTouchMove"
-                bind:touchstart="onTouchStart"
-              >
-                <wx-view
-                  class="t-picker-item__wrapper"
-                  style="transition: transform 0ms cubic-bezier(0.215, 0.61, 0.355, 1); transform: translate3d(0, 0px, 0)"
-                >
-                  <wx-view
-                    class="t-picker-item__item t-picker-item__item--active"
-                    data-index="{{0}}"
-                  >
-                    
-      2021年
-    
-                  </wx-view>
-                  <wx-view
-                    class="t-picker-item__item"
-                    data-index="{{1}}"
-                  >
-                    
-      2020年
-    
-                  </wx-view>
-                  <wx-view
-                    class="t-picker-item__item"
-                    data-index="{{2}}"
-                  >
-                    
-      2019年
-    
-                  </wx-view>
-                </wx-view>
-              </wx-view>
-            </t-picker-item>
-            <t-picker-item>
-              <wx-view
-                class="t-picker-item__group class t-class"
-                style=""
-                bind:touchcancel="onTouchEnd"
-                bind:touchend="onTouchEnd"
-                catch:touchmove="onTouchMove"
-                bind:touchstart="onTouchStart"
-              >
-                <wx-view
-                  class="t-picker-item__wrapper"
-                  style="transition: transform 0ms cubic-bezier(0.215, 0.61, 0.355, 1); transform: translate3d(0, 0px, 0)"
-                >
-                  <wx-view
-                    class="t-picker-item__item t-picker-item__item--active"
-                    data-index="{{0}}"
-                  >
-                    
+            <wx-view
+              class="t-picker-item__item t-picker-item__item--active"
+              data-index="{{0}}"
+            >
+              
       春
     
-                  </wx-view>
-                  <wx-view
-                    class="t-picker-item__item"
-                    data-index="{{1}}"
-                  >
-                    
+            </wx-view>
+            <wx-view
+              class="t-picker-item__item"
+              data-index="{{1}}"
+            >
+              
       夏
     
-                  </wx-view>
-                  <wx-view
-                    class="t-picker-item__item"
-                    data-index="{{2}}"
-                  >
-                    
+            </wx-view>
+            <wx-view
+              class="t-picker-item__item"
+              data-index="{{2}}"
+            >
+              
       秋
     
-                  </wx-view>
-                  <wx-view
-                    class="t-picker-item__item"
-                    data-index="{{3}}"
-                  >
-                    
+            </wx-view>
+            <wx-view
+              class="t-picker-item__item"
+              data-index="{{3}}"
+            >
+              
       冬
     
-                  </wx-view>
-                </wx-view>
-              </wx-view>
-            </t-picker-item>
-            <wx-view
-              class="t-picker__mask t-picker__mask--top"
-            />
-            <wx-view
-              class="t-picker__mask t-picker__mask--bottom"
-            />
-            <wx-view
-              class="t-picker__indicator"
-            />
+            </wx-view>
           </wx-view>
         </wx-view>
         <wx-view
-          class="t-popup__close"
-          bind:tap="handleClose"
+          class="t-picker__mask t-picker__mask--top"
+        />
+        <wx-view
+          class="t-picker__mask t-picker__mask--bottom"
+        />
+        <wx-view
+          class="t-picker__indicator"
         />
       </wx-view>
     </wx-view>
-    <t-overlay
-      id="popup-overlay"
-      bind:tap="handleOverlayClick"
-    >
-      <wx-view
-        ariaLabel="关闭"
-        ariaRole="button"
-        class="t-overlay t-fade-enter t-fade-enter-active class"
-        style="z-index:11000;"
-        bind:tap="handleClick"
-        catch:touchmove="noop"
-        bind:transitionend="onTransitionEnd"
-      />
-    </t-overlay>
-  </t-popup>
-</t-picker>
+    <wx-view
+      class="t-popup__close"
+      bind:tap="handleClose"
+    />
+  </wx-view>
+</wx-view>
 `;
diff --git a/src/search/__test__/__virtualHostSnapshot__/index.test.js.snap b/src/search/__test__/__virtualHostSnapshot__/index.test.js.snap
index 1c1ffb374..7224092aa 100644
--- a/src/search/__test__/__virtualHostSnapshot__/index.test.js.snap
+++ b/src/search/__test__/__virtualHostSnapshot__/index.test.js.snap
@@ -2,15 +2,20 @@
 
 exports[`search Props :base 1`] = `
 <main>
-  <t-search
-    class="search"
+  <wx-view
+    class="class t-search t-class"
+    style=""
   >
     <wx-view
-      class="class t-search t-class"
-      style=""
+      class="t-search__input-box t-not-focused t-search__input-box-- t-search__input-box--square t-class-input-container"
     >
       <wx-view
-        class="t-search__input-box t-not-focused t-search__input-box-- t-search__input-box--square t-class-input-container"
+        ariaHidden="{{true}}"
+        ariaLabel=""
+        ariaRole=""
+        class="t-icon class t-class"
+        style="font-size: 24px;"
+        bind:tap="onTap"
       >
         <t-icon
           class="t-icon t-class-left"
@@ -45,16 +50,31 @@ exports[`search Props :base 1`] = `
           bind:input="onInput"
         />
       </wx-view>
-      <wx-view
-        ariaRole="button"
-        class="t-search__search-action t-class-action"
-        bind:tap="onActionClick"
-      >
-        
+      <wx-input
+        class="t-input__keyword t-class-input"
+        confirmType="search"
+        disabled="{{false}}"
+        focus="{{false}}"
+        name="input"
+        placeholder=""
+        placeholderClass="t-search__placeholder t-search__placeholder--normal"
+        type="text"
+        value=""
+        bind:blur="onBlur"
+        bind:confirm="onConfirm"
+        bind:focus="onFocus"
+        bind:input="onInput"
+      />
+    </wx-view>
+    <wx-view
+      ariaRole="button"
+      class="t-search__search-action t-class-action"
+      bind:tap="onActionClick"
+    >
+      
     提交
   
-      </wx-view>
     </wx-view>
-  </t-search>
+  </wx-view>
 </main>
 `;
diff --git a/src/skeleton/__test__/__virtualHostSnapshot__/index.test.js.snap b/src/skeleton/__test__/__virtualHostSnapshot__/index.test.js.snap
index 9271cabc9..90d44529c 100644
--- a/src/skeleton/__test__/__virtualHostSnapshot__/index.test.js.snap
+++ b/src/skeleton/__test__/__virtualHostSnapshot__/index.test.js.snap
@@ -2,162 +2,150 @@
 
 exports[`skeleton Props :inner rowCol 1`] = `
 <main>
-  <t-skeleton
-    class="skeleton"
+  <wx-view
+    class="t-skeleton class t-class "
+    style=""
   >
     <wx-view
-      class="t-skeleton class t-class "
-      style=""
+      class="t-skeleton__content"
     >
       <wx-view
-        class="t-skeleton__content"
+        class="t-skeleton__row t-class-row"
       >
         <wx-view
-          class="t-skeleton__row t-class-row"
-        >
-          <wx-view
-            class="t-skeleton__col t-skeleton--type-text t-skeleton--animation-none t-class-col"
-            style="width:24%;height:32rpx;margin-right:32rpx"
-          />
-          <wx-view
-            class="t-skeleton__col t-skeleton--type-text t-skeleton--animation-none t-class-col"
-            style="width:76%;height:32rpx"
-          />
-        </wx-view>
+          class="t-skeleton__col t-skeleton--type-text t-skeleton--animation-none t-class-col"
+          style="width:24%;height:32rpx;margin-right:32rpx"
+        />
         <wx-view
-          class="t-skeleton__row t-class-row"
-        >
-          <wx-view
-            class="t-skeleton__col t-skeleton--type-text t-skeleton--animation-none t-class-col"
-            style=""
-          />
-        </wx-view>
+          class="t-skeleton__col t-skeleton--type-text t-skeleton--animation-none t-class-col"
+          style="width:76%;height:32rpx"
+        />
+      </wx-view>
+      <wx-view
+        class="t-skeleton__row t-class-row"
+      >
+        <wx-view
+          class="t-skeleton__col t-skeleton--type-text t-skeleton--animation-none t-class-col"
+          style=""
+        />
       </wx-view>
     </wx-view>
-  </t-skeleton>
+  </wx-view>
 </main>
 `;
 
 exports[`skeleton Props :text rowCol 1`] = `
 <main>
-  <t-skeleton
-    class="skeleton"
+  <wx-view
+    class="t-skeleton class t-class "
+    style=""
   >
     <wx-view
-      class="t-skeleton class t-class "
-      style=""
+      class="t-skeleton__content"
     >
       <wx-view
-        class="t-skeleton__content"
+        class="t-skeleton__row t-class-row"
       >
         <wx-view
-          class="t-skeleton__row t-class-row"
-        >
-          <wx-view
-            class="t-skeleton__col t-skeleton--type-text t-skeleton--animation-none t-class-col"
-            style="width:686rpx;height:32rpx"
-          />
-        </wx-view>
+          class="t-skeleton__col t-skeleton--type-text t-skeleton--animation-none t-class-col"
+          style="width:686rpx;height:32rpx"
+        />
+      </wx-view>
+      <wx-view
+        class="t-skeleton__row t-class-row"
+      >
         <wx-view
-          class="t-skeleton__row t-class-row"
-        >
-          <wx-view
-            class="t-skeleton__col t-skeleton--type-text t-skeleton--animation-none t-class-col"
-            style=""
-          />
-        </wx-view>
+          class="t-skeleton__col t-skeleton--type-text t-skeleton--animation-none t-class-col"
+          style=""
+        />
+      </wx-view>
+      <wx-view
+        class="t-skeleton__row t-class-row"
+      >
         <wx-view
-          class="t-skeleton__row t-class-row"
-        >
-          <wx-view
-            class="t-skeleton__col t-skeleton--type-text t-skeleton--animation-none t-class-col"
-            style=""
-          />
-        </wx-view>
+          class="t-skeleton__col t-skeleton--type-text t-skeleton--animation-none t-class-col"
+          style=""
+        />
+      </wx-view>
+      <wx-view
+        class="t-skeleton__row t-class-row"
+      >
+        <wx-view
+          class="t-skeleton__col t-skeleton--type-text t-skeleton--animation-none t-class-col"
+          style="width:38rpx;height:32rpx;margin-right:20rpx;margin-left:20rpx"
+        />
         <wx-view
-          class="t-skeleton__row t-class-row"
-        >
-          <wx-view
-            class="t-skeleton__col t-skeleton--type-text t-skeleton--animation-none t-class-col"
-            style="width:38rpx;height:32rpx;margin-right:20rpx;margin-left:20rpx"
-          />
-          <wx-view
-            class="t-skeleton__col t-skeleton--type-text t-skeleton--animation-none t-class-col"
-            style="width:38rpx;height:32rpx"
-          />
-        </wx-view>
+          class="t-skeleton__col t-skeleton--type-text t-skeleton--animation-none t-class-col"
+          style="width:38rpx;height:32rpx"
+        />
+      </wx-view>
+      <wx-view
+        class="t-skeleton__row t-class-row"
+      >
         <wx-view
-          class="t-skeleton__row t-class-row"
-        >
-          <wx-view
-            class="t-skeleton__col t-skeleton--type-text t-skeleton--animation-none t-class-col"
-            style="width:440rpx"
-          />
-        </wx-view>
+          class="t-skeleton__col t-skeleton--type-text t-skeleton--animation-none t-class-col"
+          style="width:440rpx"
+        />
       </wx-view>
     </wx-view>
-  </t-skeleton>
+  </wx-view>
 </main>
 `;
 
 exports[`skeleton Props :text rowCol2 1`] = `
 <main>
-  <t-skeleton
-    class="skeleton"
+  <wx-view
+    class="t-skeleton class t-class "
+    style=""
   >
     <wx-view
-      class="t-skeleton class t-class "
-      style=""
+      class="t-skeleton__content"
     >
       <wx-view
-        class="t-skeleton__content"
+        class="t-skeleton__row t-class-row"
       >
         <wx-view
-          class="t-skeleton__row t-class-row"
-        >
-          <wx-view
-            class="t-skeleton__col t-skeleton--type-text t-skeleton--animation-none t-class-col"
-            style="width:343px;height:16px"
-          />
-        </wx-view>
+          class="t-skeleton__col t-skeleton--type-text t-skeleton--animation-none t-class-col"
+          style="width:343px;height:16px"
+        />
+      </wx-view>
+      <wx-view
+        class="t-skeleton__row t-class-row"
+      >
         <wx-view
-          class="t-skeleton__row t-class-row"
-        >
-          <wx-view
-            class="t-skeleton__col t-skeleton--type-text t-skeleton--animation-none t-class-col"
-            style=""
-          />
-        </wx-view>
+          class="t-skeleton__col t-skeleton--type-text t-skeleton--animation-none t-class-col"
+          style=""
+        />
+      </wx-view>
+      <wx-view
+        class="t-skeleton__row t-class-row"
+      >
         <wx-view
-          class="t-skeleton__row t-class-row"
-        >
-          <wx-view
-            class="t-skeleton__col t-skeleton--type-text t-skeleton--animation-none t-class-col"
-            style=""
-          />
-        </wx-view>
+          class="t-skeleton__col t-skeleton--type-text t-skeleton--animation-none t-class-col"
+          style=""
+        />
+      </wx-view>
+      <wx-view
+        class="t-skeleton__row t-class-row"
+      >
+        <wx-view
+          class="t-skeleton__col t-skeleton--type-text t-skeleton--animation-none t-class-col"
+          style="width:14px;height:16px;margin-right:10px;margin-left:10px"
+        />
         <wx-view
-          class="t-skeleton__row t-class-row"
-        >
-          <wx-view
-            class="t-skeleton__col t-skeleton--type-text t-skeleton--animation-none t-class-col"
-            style="width:14px;height:16px;margin-right:10px;margin-left:10px"
-          />
-          <wx-view
-            class="t-skeleton__col t-skeleton--type-text t-skeleton--animation-none t-class-col"
-            style="width:small;height:small"
-          />
-        </wx-view>
+          class="t-skeleton__col t-skeleton--type-text t-skeleton--animation-none t-class-col"
+          style="width:small;height:small"
+        />
+      </wx-view>
+      <wx-view
+        class="t-skeleton__row t-class-row"
+      >
         <wx-view
-          class="t-skeleton__row t-class-row"
-        >
-          <wx-view
-            class="t-skeleton__col t-skeleton--type-text t-skeleton--animation-none t-class-col"
-            style="width:220px"
-          />
-        </wx-view>
+          class="t-skeleton__col t-skeleton--type-text t-skeleton--animation-none t-class-col"
+          style="width:220px"
+        />
       </wx-view>
     </wx-view>
-  </t-skeleton>
+  </wx-view>
 </main>
 `;
diff --git a/src/stepper/__test__/__virtualHostSnapshot__/index.test.js.snap b/src/stepper/__test__/__virtualHostSnapshot__/index.test.js.snap
index 24d454a7f..cd20881f7 100644
--- a/src/stepper/__test__/__virtualHostSnapshot__/index.test.js.snap
+++ b/src/stepper/__test__/__virtualHostSnapshot__/index.test.js.snap
@@ -12,22 +12,18 @@ exports[`stepper event : input 1`] = `
     class="t-stepper__minus t-stepper__minus--normal t-stepper__icon--medium  t-class-minus"
     catch:tap="minusValue"
   >
-    <t-icon
-      class="t-stepper__minus-icon"
+    <wx-view
+      ariaHidden="{{false}}"
+      ariaLabel=""
+      ariaRole=""
+      class="t-icon class t-class"
+      style=""
+      bind:tap="onTap"
     >
-      <wx-view
-        ariaHidden="{{false}}"
-        ariaLabel=""
-        ariaRole=""
-        class="t-icon class t-class"
-        style=""
-        bind:tap="onTap"
-      >
-        <wx-label
-          class="t-icon-remove t-icon-base"
-        />
-      </wx-view>
-    </t-icon>
+      <wx-label
+        class="t-icon-remove t-icon-base"
+      />
+    </wx-view>
   </wx-view>
   <wx-view
     class="t-stepper__input--normal "
@@ -50,22 +46,18 @@ exports[`stepper event : input 1`] = `
     class="t-stepper__plus t-stepper__plus--normal t-stepper__icon--medium   t-class-plus"
     catch:tap="plusValue"
   >
-    <t-icon
-      class="t-stepper__plus-icon"
+    <wx-view
+      ariaHidden="{{false}}"
+      ariaLabel=""
+      ariaRole=""
+      class="t-icon class t-class"
+      style=""
+      bind:tap="onTap"
     >
-      <wx-view
-        ariaHidden="{{false}}"
-        ariaLabel=""
-        ariaRole=""
-        class="t-icon class t-class"
-        style=""
-        bind:tap="onTap"
-      >
-        <wx-label
-          class="t-icon-add t-icon-base"
-        />
-      </wx-view>
-    </t-icon>
+      <wx-label
+        class="t-icon-add t-icon-base"
+      />
+    </wx-view>
   </wx-view>
 </wx-view>
 `;
@@ -82,22 +74,18 @@ exports[`stepper event : input 2`] = `
     class="t-stepper__minus t-stepper__minus--normal t-stepper__icon--medium  t-class-minus"
     catch:tap="minusValue"
   >
-    <t-icon
-      class="t-stepper__minus-icon"
+    <wx-view
+      ariaHidden="{{false}}"
+      ariaLabel=""
+      ariaRole=""
+      class="t-icon class t-class"
+      style=""
+      bind:tap="onTap"
     >
-      <wx-view
-        ariaHidden="{{false}}"
-        ariaLabel=""
-        ariaRole=""
-        class="t-icon class t-class"
-        style=""
-        bind:tap="onTap"
-      >
-        <wx-label
-          class="t-icon-remove t-icon-base"
-        />
-      </wx-view>
-    </t-icon>
+      <wx-label
+        class="t-icon-remove t-icon-base"
+      />
+    </wx-view>
   </wx-view>
   <wx-view
     class="t-stepper__input--normal "
@@ -120,22 +108,18 @@ exports[`stepper event : input 2`] = `
     class="t-stepper__plus t-stepper__plus--normal t-stepper__icon--medium   t-class-plus"
     catch:tap="plusValue"
   >
-    <t-icon
-      class="t-stepper__plus-icon"
+    <wx-view
+      ariaHidden="{{false}}"
+      ariaLabel=""
+      ariaRole=""
+      class="t-icon class t-class"
+      style=""
+      bind:tap="onTap"
     >
-      <wx-view
-        ariaHidden="{{false}}"
-        ariaLabel=""
-        ariaRole=""
-        class="t-icon class t-class"
-        style=""
-        bind:tap="onTap"
-      >
-        <wx-label
-          class="t-icon-add t-icon-base"
-        />
-      </wx-view>
-    </t-icon>
+      <wx-label
+        class="t-icon-add t-icon-base"
+      />
+    </wx-view>
   </wx-view>
 </wx-view>
 `;
diff --git a/src/swiper-nav/swiper-nav.wxml b/src/swiper-nav/swiper-nav.wxml
index 35ed33a4a..0598edb54 100644
--- a/src/swiper-nav/swiper-nav.wxml
+++ b/src/swiper-nav/swiper-nav.wxml
@@ -1,6 +1,5 @@
 <wxs src="../common/utils.wxs" module="_" />
 
-
 <view
   wx:if="{{showControls}}"
   class="class {{prefix}}-class {{classPrefix}}__btn"
diff --git a/src/switch/__test__/__virtualHostSnapshot__/index.test.js.snap b/src/switch/__test__/__virtualHostSnapshot__/index.test.js.snap
index 4f9ce97ac..938cc604e 100644
--- a/src/switch/__test__/__virtualHostSnapshot__/index.test.js.snap
+++ b/src/switch/__test__/__virtualHostSnapshot__/index.test.js.snap
@@ -2,28 +2,26 @@
 
 exports[`switch Props :base 1`] = `
 <main>
-  <t-switch>
+  <wx-view
+    ariaChecked="{{false}}"
+    ariaDisabled="{{false}}"
+    ariaRole="switch"
+    class="class t-class t-switch"
+    style=""
+    bind:tap="handleSwitch"
+  >
     <wx-view
-      ariaChecked="{{false}}"
-      ariaDisabled="{{false}}"
-      ariaRole="switch"
-      class="class t-class t-switch"
-      style=""
-      bind:tap="handleSwitch"
+      class="t-switch__body t-switch__body--medium t-class-body"
     >
       <wx-view
-        class="t-switch__body t-switch__body--medium t-class-body"
+        ariaHidden="{{true}}"
+        class="t-switch__dot t-switch__dot--plain t-switch__dot--medium t-class-dot"
       >
         <wx-view
-          ariaHidden="{{true}}"
-          class="t-switch__dot t-switch__dot--plain t-switch__dot--medium t-class-dot"
-        >
-          <wx-view
-            class="t-switch__label t-switch__label--medium t-class-label"
-          />
-        </wx-view>
+          class="t-switch__label t-switch__label--medium t-class-label"
+        />
       </wx-view>
     </wx-view>
-  </t-switch>
+  </wx-view>
 </main>
 `;
diff --git a/src/textarea/__test__/__virtualHostSnapshot__/index.test.js.snap b/src/textarea/__test__/__virtualHostSnapshot__/index.test.js.snap
index 3e3ba44f9..f41005565 100644
--- a/src/textarea/__test__/__virtualHostSnapshot__/index.test.js.snap
+++ b/src/textarea/__test__/__virtualHostSnapshot__/index.test.js.snap
@@ -1,15 +1,15 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`textarea slots : label 1`] = `
-<t-textarea
-  class="base"
+<wx-view
+  class="t-textarea  class t-class"
+  style=""
 >
   <wx-view
-    class="t-textarea  class t-class"
-    style=""
+    class="t-textarea__label t-class-label"
   >
-    <wx-view
-      class="t-textarea__label t-class-label"
+    <wx-text
+      slot="label"
     >
       <wx-text
         slot="label"
@@ -51,5 +51,39 @@ exports[`textarea slots : label 1`] = `
       />
     </wx-view>
   </wx-view>
-</t-textarea>
+  <wx-view
+    class="t-textarea__wrapper"
+  >
+    <wx-textarea
+      adjustPosition="{{true}}"
+      autoFocus="{{false}}"
+      autoHeight="{{false}}"
+      class="t-textarea__wrapper-inner  t-class-textarea"
+      confirmHold="{{false}}"
+      confirmType="return"
+      cursor="{{-1}}"
+      cursorSpacing="{{0}}"
+      disabled="{{false}}"
+      disableDefaultPadding="{{false}}"
+      fixed="{{false}}"
+      focus="{{false}}"
+      holdKeyboard="{{false}}"
+      maxlength="{{-1}}"
+      placeholder=""
+      placeholderClass="t-textarea__placeholder"
+      placeholderStyle=""
+      selectionEnd="{{-1}}"
+      selectionStart="{{-1}}"
+      showConfirmBar="{{true}}"
+      style=""
+      value=""
+      bind:blur="onBlur"
+      bind:confirm="onConfirm"
+      bind:focus="onFocus"
+      bind:input="onInput"
+      bind:keyboardheightchange="onKeyboardHeightChange"
+      bind:linechange="onLineChange"
+    />
+  </wx-view>
+</wx-view>
 `;