From 513389c93eb29fb863d4fba11ffb7dadaf434091 Mon Sep 17 00:00:00 2001
From: Jecyu <jecyu.lin@gmail.com>
Date: Mon, 29 Nov 2021 07:04:59 +0800
Subject: [PATCH 1/2] =?UTF-8?q?fix(splitter):=20=E4=BF=AE=E5=A4=8D=20split?=
 =?UTF-8?q?ter-bar=20hover=20=E9=BC=A0=E6=A0=87=E6=B2=A1=E6=9C=89=E6=98=BE?=
 =?UTF-8?q?=E7=A4=BA=E5=8F=AF=E6=8B=96=E6=8B=BD=E6=A0=B7=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../devui/splitter/src/splitter-bar.tsx       | 29 +++++++++----------
 .../docs/components/splitter/index.md         | 14 ---------
 2 files changed, 14 insertions(+), 29 deletions(-)

diff --git a/packages/devui-vue/devui/splitter/src/splitter-bar.tsx b/packages/devui-vue/devui/splitter/src/splitter-bar.tsx
index 949640cc..f98f9311 100644
--- a/packages/devui-vue/devui/splitter/src/splitter-bar.tsx
+++ b/packages/devui-vue/devui/splitter/src/splitter-bar.tsx
@@ -25,22 +25,21 @@ export default defineComponent({
       wrapperClass: `devui-splitter-bar devui-splitter-bar-${props.orientation}`,
     })
     const domRef = ref<null | HTMLElement>()
-    onMounted(() => {
-      watch([() => props.splitBarSize, domRef], ([curSplitBarSize, ele]) => {
-        if (!(ele instanceof HTMLElement)) {
-          return;
-        }
-        setStyle(ele, { flexBasis: curSplitBarSize })
-      }, { immediate: true })
 
-      watch([() => store.state.panes, domRef], ([panes, ele]) => {
-        if (!store.isStaticBar(props.index)) {
-          state.wrapperClass += ' resizable'
-        } else {
-          setStyle(ele, { flexBasis: props.disabledBarSize })
-        }
-      }, { deep: true })
-    })
+    watch([() => props.splitBarSize, domRef], ([curSplitBarSize, ele]) => {
+      if (!(ele instanceof HTMLElement)) {
+        return;
+      }
+      setStyle(ele, { flexBasis: curSplitBarSize })
+    }, { immediate: true })
+
+    watch([() => store.state.panes, domRef], ([panes, ele]) => {
+      if (!store.isStaticBar(props.index)) {
+        state.wrapperClass += ' resizable'
+      } else {
+        setStyle(ele, { flexBasis: props.disabledBarSize })
+      }
+    }, { deep: true })
 
     // 指令输入值
     const coordinate = { pageX: 0, pageY: 0, originalX: 0, originalY: 0 }
diff --git a/packages/devui-vue/docs/components/splitter/index.md b/packages/devui-vue/docs/components/splitter/index.md
index c231ea9e..e24e1f63 100644
--- a/packages/devui-vue/docs/components/splitter/index.md
+++ b/packages/devui-vue/docs/components/splitter/index.md
@@ -77,20 +77,6 @@ export default defineComponent({
 ```
 :::
 
-
- <!-- `<style lang="scss"></style>` 的写法，在 `:::demo 语法中` 不起作用， 看了依赖包 `vitepress-theme-demoblock` 源码
-是渲染的正则表达式只匹配 `<style></style>` 这种写法，TODO：待后续优化 
-<style lang="scss"> 
-@import "@devui/style/theme/color";
-
-.pane-content {
-  padding: 0 12px;
-}
-
-.splitter-border {
-  border: 1px solid $devui-dividing-line;
-}-->
-
 ### 垂直布局用法
 
 :::demo
-- 
Gitee


From c15fe18c79d6bc51612449a05f11dc376f928845 Mon Sep 17 00:00:00 2001
From: Jecyu <jecyu.lin@gmail.com>
Date: Mon, 29 Nov 2021 23:15:05 +0800
Subject: [PATCH 2/2] =?UTF-8?q?fix(splitter):=201.=20=E4=BF=AE=E5=A4=8D?=
 =?UTF-8?q?=E7=BB=99=E9=9D=A2=E6=9D=BF=E5=88=9D=E5=A7=8B=E5=8C=96=E5=83=8F?=
 =?UTF-8?q?=E7=B4=A0=E5=9B=BA=E5=AE=9A=E6=97=A0=E6=95=88=E9=97=AE=E9=A2=98?=
 =?UTF-8?q?=202.=20=E8=A7=A3=E5=86=B3=E6=8B=96=E6=8B=BD=E6=9D=A1=E7=A7=BB?=
 =?UTF-8?q?=E5=8A=A8=E7=9B=B8=E9=82=BB=E9=9D=A2=E6=9D=BF=E8=A2=AB=E8=81=94?=
 =?UTF-8?q?=E5=8A=A8bug?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../devui-vue/devui/splitter/src/splitter-pane.tsx    | 11 +++++------
 1 file changed, 5 insertions(+), 6 deletions(-)

diff --git a/packages/devui-vue/devui/splitter/src/splitter-pane.tsx b/packages/devui-vue/devui/splitter/src/splitter-pane.tsx
index 55760c69..98ee3893 100644
--- a/packages/devui-vue/devui/splitter/src/splitter-pane.tsx
+++ b/packages/devui-vue/devui/splitter/src/splitter-pane.tsx
@@ -2,7 +2,6 @@ import {
   defineComponent,
   ref,
   watch,
-  nextTick,
   inject,
   onMounted,
   onUpdated,
@@ -31,12 +30,10 @@ export default defineComponent({
     );
 
     // pane 初始化大小
-    const setSizeStyle = (curSize: string) => {
-      const ele = domRef.value;
+    const setSizeStyle = (curSize: string, ele: HTMLElement) => {
       if (!ele) {
         return;
       }
-
       ele.style.flexBasis = curSize;
       const paneFixedClass = 'devui-splitter-pane-fixed';
       if (curSize) {
@@ -48,8 +45,10 @@ export default defineComponent({
     };
 
     watch(
-      () => props.size,
-      setSizeStyle,
+      [() => props.size, domRef],
+      ([size, ele]) => {
+        setSizeStyle(size, ele);
+      },
       { immediate: true }
     );
 
-- 
Gitee