@neatui/vue 1.2.15 → 1.2.17

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@neatui/vue",
-  "version": "1.2.15",
+  "version": "1.2.17",
   "description": "basic component ui",
   "main": "./src/index.ts",
   "license": "MIT",

package/src/components/form/TextArea.vue

@@ -6,6 +6,7 @@
     <div v-if="ready" :ui-form-tips="state.ontips">{{ state.tips }}</div>
     <slot>
       <textarea
+        ref="el"
         :rows="rows"
         v-model="mv"
         :type="type"
@@ -23,7 +24,7 @@
 </template>
 
 <script setup lang="ts">
-  import { ref, watch, computed, onMounted, PropType } from 'vue';
+  import { ref, watch, computed, onMounted, PropType, nextTick } from 'vue';
 
   const emits = defineEmits(['update:modelValue', 'click', 'blur', 'focus', 'change', 'input', 'clear']);
   const props = defineProps({
@@ -61,6 +62,11 @@
       type: Number,
       default: null
     },
+    // 最小长度
+    autoHeight: {
+      type: Boolean,
+      default: false
+    },
     // 是否禁用
     disabled: {
       type: Boolean,
@@ -140,16 +146,26 @@
     }
   });
 
-  const mv: any = ref(props.modelValue);
+  // 自动高度
+  const el: any = ref(null);
+  const fAutoHeight = () => {
+    nextTick(() => {
+      if (props.autoHeight) {
+        el.value.style.height = 'auto';
+        el.value.style.height = Math.ceil(el.value.scrollHeight) + 'px';
+      }
+    });
+  };
 
+  const mv: any = ref(props.modelValue);
   watch(
     () => props.modelValue,
     (v: any) => {
-      console.log(149, v);
       mv.value = v;
     },
     { deep: true, immediate: true }
   );
+
   watch(
     () => mv.value,
     (v: any) => {
@@ -159,6 +175,9 @@
         mv.value = value;
       }
       emits('update:modelValue', value);
+
+      // 自动高度
+      fAutoHeight();
     },
     { deep: true }
   );
@@ -167,5 +186,7 @@
     setTimeout(() => {
       ready.value = 1;
     }, 300);
+    // 自动高度
+    fAutoHeight();
   });
 </script>