[new feature] Search: add left-icon prop

packages/search/en-US.md

@@ -68,6 +68,7 @@ Search support all native properties of input tag，such as `maxlength`、`place
 | Attribute | Description | Type | Default |
 |------|------|------|------|
 | label | Search label | `String` | - |
+| left-icon | Left icon name | `String` | `search` |
 | shape | Can be set to `round` | `String` | `square` |
 | background | Background color | `String` | `#f2f2f2` |
 | show-action | Whether to show right button | `Boolean` | `false` |

packages/search/index.tsx

@@ -13,6 +13,7 @@ export type SearchProps = {
   shape: string;
   value?: string;
   label?: string;
+  leftIcon: string;
   background: string;
   showAction?: boolean;
 };
@@ -91,9 +92,9 @@ function Search(
         <Field
           clearable
           type="search"
-          value={props.value}
           border={false}
-          leftIcon="search"
+          value={props.value}
+          leftIcon={props.leftIcon}
           scopedSlots={{ 'left-icon': slots['left-icon'] }}
           {...fieldData}
         />
@@ -114,6 +115,10 @@ Search.props = {
   background: {
     type: String,
     default: '#fff'
+  },
+  leftIcon: {
+    type: String,
+    default: 'search'
   }
 };
 

packages/search/test/__snapshots__/index.spec.js.snap

@@ -1,5 +1,19 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
+exports[`left-icon prop 1`] = `
+<div class="van-search" style="background: rgb(255, 255, 255);">
+  <div class="van-search__content van-search__content--square">
+    <div class="van-cell van-cell--borderless van-field">
+      <div class="van-field__left-icon"><i class="van-icon van-icon-setting-o">
+          <!----></i></div>
+      <div class="van-cell__value van-cell__value--alone">
+        <div class="van-field__body"><input type="search" class="van-field__control"></div>
+      </div>
+    </div>
+  </div>
+</div>
+`;
+
 exports[`render label slot 1`] = `
 <div class="van-search" style="background: rgb(255, 255, 255);">
   <div class="van-search__content van-search__content--square">

packages/search/test/index.spec.js

@@ -74,3 +74,13 @@ test('render label slot', () => {
 
   expect(wrapper).toMatchSnapshot();
 });
+
+test('left-icon prop', () => {
+  const wrapper = mount(Search, {
+    propsData: {
+      leftIcon: 'setting-o'
+    }
+  });
+
+  expect(wrapper).toMatchSnapshot();
+});

packages/search/zh-CN.md

@@ -61,6 +61,7 @@ Search 默认支持 Input 标签所有的原生属性，比如 `maxlength`、`pl
 | 参数 | 说明 | 类型 | 默认值 | 版本 |
 |------|------|------|------|------|
 | label | 搜索框左侧文本 | `String` | - | 1.6.6 |
+| left-icon | 输入框左侧图标名称或图片链接，可选值见 Icon 组件 | `String` | `search` | 2.0.0 |
 | shape | 形状，可选值为 `round` | `String` | `square` | 1.6.6 |
 | background | 搜索框背景色 | `String` | `#f2f2f2` | - |
 | show-action | 是否在搜索框右侧显示取消按钮 | `Boolean` | `false` | - |