소스 검색

fix:修复尺寸组件数据异常问题

lianghongjie 1 년 전
부모
커밋
cbc5af725e
1개의 변경된 파일32개의 추가작업 그리고 24개의 파일을 삭제
  1. 32 24
      src/modules/editor/components/CompUI/formItems/Size.tsx

+ 32 - 24
src/modules/editor/components/CompUI/formItems/Size.tsx

@@ -1,13 +1,12 @@
 import { IconHeight, IconWidth } from "@/assets/icons";
+import { useEditor } from "@/modules/editor";
 import { CompSizeOpts } from "@/modules/editor/objects/DesignTemp/creates/CompSize";
 import { Layout } from "@/modules/editor/typings";
 import { css } from "@linaria/core";
 import { InputNumber, Select } from "ant-design-vue";
-import { AnyFun } from "queenjs/typing";
 import { defineComponent, reactive } from "vue";
-import { any } from "vue-types";
+import { any, string } from "vue-types";
 import { TipIcons } from "../../TipIcons";
-import { useEditor } from "@/modules/editor";
 
 const selectOptions = [
   { value: "px", label: "PX", options: { step: 1 } },
@@ -123,27 +122,36 @@ export const Size = defineComponent({
   },
 });
 
-const SizeInput = (props: {
-  label: string;
-  icon: any;
-  value: string;
-  onChange: AnyFun;
-  onIconClick: AnyFun;
-}) => {
-  const { label, icon, ...inputProps } = props;
-  return (
-    <div class={numberInputCls}>
-      <span class="pl-14px pr-1px text-14px">{label}</span>
-      <InputNumber class="flex-1" bordered={false} {...inputProps} />
-      <icon
-        class="tipIcon"
-        onClick={() => {
-          props.onIconClick();
-        }}
-      />
-    </div>
-  );
-};
+const SizeInput = defineComponent({
+  props: {
+    label: string(),
+    icon: any(),
+    value: string(),
+  },
+  emits: ["change", "iconClick"],
+  setup(props, { emit }) {
+    return () => {
+      const { label, icon, value } = props;
+      return (
+        <div class={numberInputCls}>
+          <span class="pl-14px pr-1px text-14px">{label}</span>
+          <InputNumber
+            class="flex-1"
+            bordered={false}
+            value={value}
+            onChange={(v) => emit("change", v)}
+          />
+          <icon
+            class="tipIcon"
+            onClick={() => {
+              emit("iconClick");
+            }}
+          />
+        </div>
+      );
+    };
+  },
+});
 
 const numberInputCls = css`
   @apply inline-flex items-center flex-1 w-0 mr-12px;