examples/main.js

@@ -3,6 +3,7 @@ import App from '../src/App.vue'
 
 //基于element组件封装，引入element组件库
 import { Input } from 'element-ui';
+import 'element-ui/lib/theme-chalk/index.css';
 Vue.use(Input);
 
 // 导入组件库

packages/pedestal/src/index.vue

@@ -1,77 +1,75 @@
 <template>
-    <el-input
+  <el-input
-      class="w-input"
+    class="w-input"
-      :style="{ width }"
+    :style="{ width }"
-      :value="value"
+    :value="value"
-      :size="size"
+    :size="size"
-      v-on="inputListeners"
+    v-on="inputListeners"
-      v-bind="[$attrs]"
+    v-bind="[$attrs]"
-    >
+  >
-      <slot name="append" slot="append" />
+    <slot name="append" slot="append" />
-      <slot name="prefix" slot="prefix" />
+    <slot name="prefix" slot="prefix" />
-      <slot name="suffix" slot="suffix" />
+    <slot name="suffix" slot="suffix" />
-      <slot name="prepend" slot="prepend" />
+    <slot name="prepend" slot="prepend" />
-    </el-input>
+  </el-input>
-  </template>
+</template>
   
   <script>
-  /**
+/**
-   * WInput
+ * WInput
-   * @desc    处理输入的输入框(转大写，不能有中文空格等)
+ * @desc    处理输入的输入框(转大写，不能有中文空格等)
-   */
+ */
-  export default {
+export default {
-    name: "WInput",
+  name: "WInput",
-    props: {
+  props: {
-      width: {
+    width: {
-        type: String,
+      type: String,
-        default: "180px",
+      default: "180px",
-      },
-      size: {
-        type: String,
-        default: "small",
-      },
-      value: {
-        type: String,
-        default: "",
-      },
-      toUpperCase: {
-        type: Boolean,
-        default: true,
-      },
     },
-    computed: {
+    size: {
-      // 所有父级事件
+      type: String,
-      inputListeners() {
+      default: "small",
-        return Object.assign(
-          {},
-          // 我们从父级添加所有的监听器
-          this.$listeners,
-          // 然后我们添加自定义监听器，
-          // 或覆写一些监听器的行为
-          {
-            // 这里确保组件配合 `v-model` 的工作
-            input: (value) => {
-              this.$emit("input", this.toUpperCase ? value.toUpperCase() : value);
-            },
-            blur: (e) => {
-              let value = e.target.value
-                .trim()
-                .replace(/\s/g, (match) =>
-                  match.charCodeAt(0) === 12288 ? String.fromCharCode(32) : match
-                );
-  
-              // 失去焦点自动首位去空格
-              this.$emit("input", value);
-            },
-          }
-        );
-      },
     },
-    mounted() {
+    value: {
-    //   console.warn(this.$route.name);
+      type: String,
+      default: "",
     },
-  };
+    toUpperCase: {
-  </script>
+      type: Boolean,
+      default: true,
+    },
+  },
+  computed: {
+    // 所有父级事件
+    inputListeners() {
+      return Object.assign(
+        {},
+        // 我们从父级添加所有的监听器
+        this.$listeners,
+        // 然后我们添加自定义监听器，
+        // 或覆写一些监听器的行为
+        {
+          // 这里确保组件配合 `v-model` 的工作
+          input: (value) => {
+            this.$emit("input", this.toUpperCase ? value.toUpperCase() : value);
+          },
+          blur: (e) => {
+            let value = e.target.value
+              .trim()
+              .replace(/\s/g, (match) =>
+                match.charCodeAt(0) === 12288 ? String.fromCharCode(32) : match
+              );
+
+            // 失去焦点自动首位去空格
+            this.$emit("input", value);
+          },
+        }
+      );
+    },
+  },
+  mounted() {},
+};
+</script>
   
   <style lang="scss" scoped></style>
   

src/App.vue

@@ -1,6 +1,6 @@
 <template>
   <div>
-    <Pedestal ref="ref_Pedestal" :options="options">
+    <Pedestal ref="ref_Pedestal" v-model="value">
       <!-- <template #operate="">
         <el-button
           class="excel"
@@ -22,6 +22,7 @@ export default {
   components: { Pedestal },
   data() {
     return {
+      value: "",
       options: {
         fnSearch: this.fnSearch,
         formItemAttrs: {

src/utils/cloneDeep.js

@@ -1,4 +1,4 @@
-export default function cloneDeep(obj, hash = new WeakMap()) {
+ function cloneDeep(obj, hash = new WeakMap()) {
     if (obj == null || typeof obj !== 'object') return obj
     if (obj instanceof Date) return new Date(obj)
     if (obj instanceof RegExp) return new RegExp(obj.source, obj.flags)
@@ -10,4 +10,4 @@ export default function cloneDeep(obj, hash = new WeakMap()) {
         deepObj[key] = cloneDeep(obj[key], hash)
     }
     return deepObj
-}
+}