[new feature] Search: add right-icon prop

packages/search/en-US.md

@@ -68,7 +68,6 @@ 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` |
@@ -76,6 +75,8 @@ Search support all native properties of input tag，such as `maxlength`、`place
 | readonly | Whether to be readonly | `Boolean` | `false` |
 | error | Whether to show error info | `Boolean` | `false` |
 | input-align | Input text align, can be set to `center` `right` | `String` | `left` |
+| left-icon | Left icon name | `String` | `search` |
+| right-icon | Right icon name | `String` | - |
 
 ### Events
 

packages/search/index.tsx

@@ -14,6 +14,7 @@ export type SearchProps = {
   value?: string;
   label?: string;
   leftIcon: string;
+  rightIcon?: string;
   background: string;
   showAction?: boolean;
 };
@@ -95,6 +96,7 @@ function Search(
           border={false}
           value={props.value}
           leftIcon={props.leftIcon}
+          rightIcon={props.rightIcon}
           scopedSlots={{ 'left-icon': slots['left-icon'] }}
           {...fieldData}
         />
@@ -107,6 +109,7 @@ function Search(
 Search.props = {
   value: String,
   label: String,
+  rightIcon: String,
   showAction: Boolean,
   shape: {
     type: String,

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

@@ -28,3 +28,20 @@ exports[`render label slot 1`] = `
   </div>
 </div>
 `;
+
+exports[`right-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-search">
+          <!----></i></div>
+      <div class="van-cell__value van-cell__value--alone">
+        <div class="van-field__body"><input type="search" class="van-field__control">
+          <div class="van-field__right-icon"><i class="van-icon van-icon-setting-o">
+              <!----></i></div>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+`;

packages/search/test/index.spec.js

@@ -84,3 +84,13 @@ test('left-icon prop', () => {
 
   expect(wrapper).toMatchSnapshot();
 });
+
+test('right-icon prop', () => {
+  const wrapper = mount(Search, {
+    propsData: {
+      rightIcon: 'setting-o'
+    }
+  });
+
+  expect(wrapper).toMatchSnapshot();
+});

packages/search/zh-CN.md

@@ -61,7 +61,6 @@ 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` | - |
@@ -69,6 +68,8 @@ Search 默认支持 Input 标签所有的原生属性，比如 `maxlength`、`pl
 | readonly | 是否只读 | `Boolean` | `false` | - |
 | error | 是否将输入内容标红 | `Boolean` | `false` | - |
 | input-align | 输入框内容对齐方式，可选值为 `center` `right` | `String` | `left` | - |
+| left-icon | 输入框左侧图标名称或图片链接，可选值见 Icon 组件 | `String` | `search` | 2.0.0 |
+| right-icon | 输入框右侧图标名称或图片链接，可选值见 Icon 组件 | `String` | - | 2.0.0 |
 
 ### Events