diff --git a/src/App.vue b/src/App.vue
index 58c01b9..a1558b3 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,79 +1,79 @@
 <script setup lang="ts">
-import { Splitter, Pane } from './components'
+import { SplitLayout, SplitPanel } from './components'
 </script>
 
 <template>
   <div class="container">
-    <h1>Splitter 组件示例</h1>
+    <h1>SplitLayout 组件示例</h1>
 
     <h2>水平分割</h2>
     <div class="demo-box">
-      <Splitter direction="horizontal">
-        <Pane :size="30" :min-size="100">
-          <div class="pane-content">
+      <SplitLayout direction="horizontal">
+        <SplitPanel :size="30" :min-size="100">
+          <div class="SplitPanel-content">
             <h3>左侧面板</h3>
             <p>这是左侧面板的内容，初始宽度为30%，最小宽度为100px</p>
           </div>
-        </Pane>
-        <Pane>
-          <div class="pane-content">
+        </SplitPanel>
+        <SplitPanel>
+          <div class="SplitPanel-content">
             <h3>中间面板</h3>
             <p>这是中间面板的内容，宽度自动分配</p>
           </div>
-        </Pane>
-        <Pane :size="30">
-          <div class="pane-content">
+        </SplitPanel>
+        <SplitPanel :size="30">
+          <div class="SplitPanel-content">
             <h3>右侧面板</h3>
             <p>这是右侧面板的内容，初始宽度为30%</p>
           </div>
-        </Pane>
-      </Splitter>
+        </SplitPanel>
+      </SplitLayout>
     </div>
 
     <h2>垂直分割</h2>
     <div class="demo-box">
-      <Splitter direction="vertical">
-        <Pane :size="40">
-          <div class="pane-content">
+      <SplitLayout direction="vertical">
+        <SplitPanel :size="40">
+          <div class="SplitPanel-content">
             <h3>上方面板</h3>
             <p>这是上方面板的内容，初始高度为40%</p>
           </div>
-        </Pane>
-        <Pane>
-          <div class="pane-content">
+        </SplitPanel>
+        <SplitPanel>
+          <div class="SplitPanel-content">
             <h3>下方面板</h3>
             <p>这是下方面板的内容，高度自动分配</p>
           </div>
-        </Pane>
-      </Splitter>
+        </SplitPanel>
+      </SplitLayout>
     </div>
 
     <h2>嵌套分割</h2>
     <div class="demo-box">
-      <Splitter direction="horizontal">
-        <Pane :size="30">
-          <div class="pane-content">
+      <SplitLayout direction="horizontal">
+        <SplitPanel :size="30">
+          <div class="SplitPanel-content">
             <h3>左侧面板</h3>
             <p>这是左侧面板的内容</p>
           </div>
-        </Pane>
-        <Pane :size="70">
-          <Splitter direction="vertical">
-            <Pane :size="50">
-              <div class="pane-content">
+        </SplitPanel>
+        <SplitPanel :size="70">
+          <SplitLayout direction="vertical">
+            <SplitPanel :size="50">
+              <div class="SplitPanel-content">
                 <h3>右上面板</h3>
                 <p>这是右上面板的内容</p>
               </div>
-            </Pane>
-            <Pane :size="50">
-              <div class="pane-content">
+            </SplitPanel>
+            <SplitPanel :size="50">
+              <div class="SplitPanel-content">
                 <h3>右下面板</h3>
                 <p>这是右下面板的内容</p>
               </div>
-            </Pane>
-          </Splitter>
-        </Pane>
-      </Splitter>
+            </SplitPanel>
+          </SplitLayout>
+        </SplitPanel>
+      </SplitLayout>
     </div>
   </div>
 </template>
@@ -102,14 +102,14 @@ h2 {
   margin-bottom: 30px;
 }
 
-.pane-content {
+.SplitPanel-content {
   padding: 16px;
   height: 100%;
   box-sizing: border-box;
   background-color: #f5f5f5;
 }
 
-.pane-content h3 {
+.SplitPanel-content h3 {
   margin-top: 0;
   margin-bottom: 10px;
   color: #1890ff;
diff --git a/src/components/Splitter.vue b/src/components/SplitLayout.vue
similarity index 100%
rename from src/components/Splitter.vue
rename to src/components/SplitLayout.vue
diff --git a/src/components/Pane.vue b/src/components/SplitPanel.vue
similarity index 100%
rename from src/components/Pane.vue
rename to src/components/SplitPanel.vue
diff --git a/src/components/index.ts b/src/components/index.ts
index 7611d54..ede3089 100644
--- a/src/components/index.ts
+++ b/src/components/index.ts
@@ -1,5 +1,4 @@
-import Splitter from './Splitter.vue'
-import Pane from './Pane.vue'
+import SplitLayout from './SplitLayout.vue'
+import SplitPanel from './SplitPanel.vue'
 
-export { Splitter, Pane }
-export default { Splitter, Pane }
+export { SplitLayout, SplitPanel }