diff --git a/pages/tab/index.js b/pages/tab/index.js
index ec90dec5..2d08749c 100644
--- a/pages/tab/index.js
+++ b/pages/tab/index.js
@@ -49,11 +49,11 @@ Page(Object.assign({}, ZUI.Tab, {
 
   handleZuiTabChange(e) {
     console.info('[ZUI:Tab:Change]', e);
-    var id = e.id;
+    var componentId = e.componentId;
     var selectedId = e.selectedId;
 
     this.setData({
-      [`${id}.selectedId`]: selectedId
+      [`${componentId}.selectedId`]: selectedId
     });
   }
 }));
diff --git a/pages/tab/index.wxml b/pages/tab/index.wxml
index 12cb9134..afca7396 100644
--- a/pages/tab/index.wxml
+++ b/pages/tab/index.wxml
@@ -2,9 +2,9 @@
 
 <view class="container">
   <view style="margin: 20px 0">
-    <template is="zui-tab" data="{{tab: tab1, id: 'tab1'}}"></template>
+    <template is="zui-tab" data="{{tab: tab1, componentId: 'tab1'}}"></template>
   </view>
   <view style="margin: 20px 0">
-    <template is="zui-tab" data="{{tab: tab2, id: 'tab2'}}"></template>
+    <template is="zui-tab" data="{{tab: tab2, componentId: 'tab2'}}"></template>
   </view>
 </view>
diff --git a/zui/tab/index.js b/zui/tab/index.js
index 7cc2ff29..1482339c 100644
--- a/zui/tab/index.js
+++ b/zui/tab/index.js
@@ -1,12 +1,12 @@
 var Tab = {
   _handleZuiTabChange(e) {
     var dataset = e.currentTarget.dataset;
-    var id = dataset.id;
+    var componentId = dataset.componentId;
     var selectedId = dataset.itemId;
 
     if (this.handleZuiTabChange) {
       this.handleZuiTabChange({
-        id,
+        componentId,
         selectedId
       });
     }
diff --git a/zui/tab/index.wxml b/zui/tab/index.wxml
index 2ca933c8..955a447d 100644
--- a/zui/tab/index.wxml
+++ b/zui/tab/index.wxml
@@ -2,12 +2,12 @@
   <view class="zui-tab">
       <block wx:if="{{tab.scroll}}">
         <scroll-view class="zui-tab__bd zui-tab__bd--scroll {{fixed ? 'zui-tab__bd--fixed' : ''}}" scroll-x="true">
-          <template is="zui-tab-list" data="{{ tab, id }}"></template>
+          <template is="zui-tab-list" data="{{ tab, componentId }}"></template>
         </scroll-view>
       </block>
       <block wx:else>
         <view class="zui-tab__bd">
-          <template is="zui-tab-list" data="{{ tab, id }}"></template>
+          <template is="zui-tab-list" data="{{ tab, componentId }}"></template>
         </view>
       </block>
   </view>
@@ -18,7 +18,7 @@
     wx:for="{{tab.list}}"
     wx:key="id"
     class="zui-tab__item {{tab.selectedId == item.id ? 'zui-tab__item--selected' : ''}}"
-    data-id="{{id}}"
+    data-component-id="{{componentId}}"
     data-item-id="{{item.id}}"
     bindtap="_handleZuiTabChange"
   >