feat(Search): add name prop (#9563)

packages/vant/src/field/Field.tsx

@@ -61,6 +61,7 @@ const [name, bem] = createNamespace('field');
 // provide to Search component to inherit
 export const fieldSharedProps = {
   id: String,
+  name: String,
   formatter: Function as PropType<(value: string) => string>,
   leftIcon: String,
   rightIcon: String,
@@ -103,7 +104,6 @@ export const fieldSharedProps = {
 
 const props = extend({}, cellProps, fieldSharedProps, {
   rows: [Number, String],
-  name: String,
   rules: Array as PropType<FieldRule[]>,
   autosize: [Boolean, Object] as PropType<boolean | FieldAutosizeConfig>,
   labelWidth: [Number, String],

packages/vant/src/field/README.md

@@ -247,9 +247,9 @@ Use `input-align` prop to align the input value.
 
 | Attribute | Description | Type | Default |
 | --- | --- | --- | --- |
-| v-model | Field value | _number \| string_ | - |
+| v-model | Input value | _number \| string_ | - |
-| label | Field label | _string_ | - |
+| label | Left side label | _string_ | - |
-| name | Field name | _string_ | - |
+| name | As the identifier when submitting the form | _string_ | - |
 | id `v3.2.2` | Input id, the for attribute of the label also will be set | _string_ | - |
 | type | Input type, can be set to `tel` `digit`<br>`number` `textarea` `password` | _string_ | `text` |
 | size | Size，can be set to `large` | _string_ | - |

packages/vant/src/search/README.md

@@ -118,7 +118,9 @@ Use `action` slot to custom right button, `cancel` event will no longer be Emitt
 
 | Attribute | Description | Type | Default |
 | --- | --- | --- | --- |
+| v-model | Input value | _number \| string_ | - |
 | label | Left side label | _string_ | - |
+| name `v3.2.3` | As the identifier when submitting the form | _string_ | - |
 | shape | Shape of field, can be set to `round` | _string_ | `square` |
 | id `v3.2.2` | Input id, the for attribute of the label also will be set | _string_ | - |
 | background | Background color of field | _string_ | `#f2f2f2` |

packages/vant/src/search/README.zh-CN.md

@@ -130,7 +130,9 @@ export default {
 
 | 参数 | 说明 | 类型 | 默认值 |
 | --- | --- | --- | --- |
+| v-model | 当前输入的值 | _number \| string_ | - |
 | label | 搜索框左侧文本 | _string_ | - |
+| name `v3.2.3` | 名称，作为提交表单时的标识符 | _string_ | - |
 | shape | 搜索框形状，可选值为 `round` | _string_ | `square` |
 | id `v3.2.2` | 搜索框 id，同时会设置 label 的 for 属性 | _string_ | - |
 | background | 搜索框外部背景色 | _string_ | `#f2f2f2` |

packages/vant/src/search/test/index.spec.ts

@@ -161,3 +161,12 @@ test('should allow to set autocomplete attribute', () => {
     'on'
   );
 });
+
+test('should render input name when using name prop', () => {
+  const wrapper = mount(Search, {
+    props: {
+      name: 'foo',
+    },
+  });
+  expect(wrapper.find('input').element.getAttribute('name')).toEqual('foo');
+});