feat(search): [search] Increase input maximum character limit attribu…

…te maxlength
opentiny · Mar 4, 2024 · 231f3fe · 231f3fe
1 parent 41fa0ce
commit 231f3fe
Show file tree

Hide file tree

Showing 5 changed files with 31 additions and 4 deletions.
diff --git a/examples/sites/demos/apis/search.js b/examples/sites/demos/apis/search.js
@@ -74,6 +74,17 @@ export default {
           pcDemo: 'events',
           mfDemo: ''
         },
+        {
+          name: 'maxlength',
+          type: 'number',
+          defaultValue: '',
+          desc: {
+            'zh-CN': 'input 框的原生属性，限制最大输入字符数【3.14.0新增】',
+            'en-US': 'The native properties of the input box limit the maximum number of input characters[New 3.14.0]'
+          },
+          mode: ['pc'],
+          pcDemo: 'basic-usage'
+        },
         {
           name: 'mini',
           type: 'boolean',

diff --git a/examples/sites/demos/pc/app/search/basic-usage-composition-api.vue b/examples/sites/demos/pc/app/search/basic-usage-composition-api.vue
@@ -1,6 +1,6 @@
 <template>
   <div>
-    <tiny-search v-model="value" placeholder="请输入关键词"></tiny-search>
+    <tiny-search v-model="value" placeholder="请输入关键词" :maxlength="10"></tiny-search>
     <div class="mt10">当前搜索值为：{{ value }}</div>
   </div>
 </template>

diff --git a/examples/sites/demos/pc/app/search/basic-usage.vue b/examples/sites/demos/pc/app/search/basic-usage.vue
@@ -1,6 +1,6 @@
 <template>
   <div>
-    <tiny-search v-model="value" placeholder="请输入关键词"></tiny-search>
+    <tiny-search v-model="value" placeholder="请输入关键词" :maxlength="10"></tiny-search>
     <div class="mt10">当前搜索值为：{{ value }}</div>
   </div>
 </template>

diff --git a/examples/sites/demos/pc/app/search/webdoc/search.js b/examples/sites/demos/pc/app/search/webdoc/search.js
@@ -9,9 +9,10 @@ export default {
         'en-US': 'Basic Usage'
       },
       desc: {
-        'zh-CN': '通过 <code>v-model</code> 设置双向绑定搜索值， <code>placeholder</code> 设置默认占位符文本。',
+        'zh-CN':
+          '通过 <code>v-model</code> 设置双向绑定搜索值， <code>placeholder</code> 设置默认占位符文本， <code>input</code>元素的原生属性<code>maxlength</code> 设置输入框最大输入字符长度。',
         'en-US':
-          'Set bidirectional binding search values through <code>v-model</code> , and set default placeholder text through <code>placeholder</code> .'
+          'Set bidirectional binding search values through <code>v-model</code> , and set default placeholder text through <code>placeholder</code> The native attribute of the <code>input</code> element<code>maxlength</code>sets the maximum input character length of the input box.'
       },
       codeFiles: ['basic-usage.vue']
     },

diff --git a/packages/vue/src/search/src/pc.vue b/packages/vue/src/search/src/pc.vue
@@ -36,6 +36,21 @@
       </transition>
       <input
         ref="input"
+        v-bind="
+          a($attrs, [
+            'type',
+            'class',
+            'style',
+            '^on\w+',
+            'id',
+            'disabled',
+            'clearable',
+            'max',
+            'min',
+            'readonly',
+            'step'
+          ])
+        "
         v-model="state.currentValue"
         :style="
           transparent