done

docs/examples-docs/badge.md

@@ -15,13 +15,13 @@
 
 ### z-badge-group API
 
-| 参数       | 说明      | 类型       | 默认值       | 必须型       |
+| 参数       | 说明      | 类型       | 默认值       | 必须      |
 |-----------|-----------|-----------|-------------|-------------|
 | active-key | 激活的badge的索引 | string  | '0'但必须子badge里的mark是有0位索引 |           |
 
 
 ### z-badge API
-| 参数       | 说明      | 类型       | 默认值       | 可选值       |
+| 参数       | 说明      | 类型       | 默认值       | 必须       |
 |-----------|-----------|-----------|-------------|-------------|
 | mark | badge的唯一key值 | string  | ''          | required         |
 | title | badge的文案标题 | string  | ''          | required          |

docs/examples-docs/search.md

@@ -1,3 +1,12 @@
+<script>
+export default {
+  methods: {
+    goSearch(value) {
+      alert(value)
+    }
+  }
+};
+</script>
 ## Search 组件
 
 ### 基础用法
@@ -6,7 +15,25 @@
 ```html
 <z-search 
     placeholder="商品名称"
+    :on-search="goSearch"
 >
 </z-search>
 ```
+
+```javascript
+export default {
+  methods: {
+    goSearch(value) {
+      alert(value)
+    }
+  }
+};
+```
 :::
+
+### API
+
+| 参数       | 说明      | 类型       | 默认值       | 必须       |
+|-----------|-----------|-----------|-------------|-------------|
+| placeholder | input的placeholder文案 | string  |           | required    |
+| on-search | 点击回车后出发搜索回调 | function  | function() {}  |   |

packages/badge/src/badge.vue

@@ -17,8 +17,12 @@ export default {
       type: String,
       required: true
     },
-    url: String,
+    url: {
-    info: String
+      type: String
+    },
+    info: {
+      type: String
+    }
   },
   methods: {
     handleClick() {

packages/search/src/search.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="z-search" :class="{ 'is-focus' : isFocus }">
     <div class="z-search__input-wrap">
-      <input type="text" :placeholder="placeholder" v-model="value" v-refocus="focusStatus"  @focus="handleFocus">
+      <input type="text" :placeholder="placeholder" v-model="value" v-refocus="focusStatus"  @focus="handleFocus" @keyup.enter="handleSearch">
       <span class="zui-icon zui-icon-close" @click="handleClean"></span>
     </div>
     <div class="z-search__cancel" :class="{ 'is-focus' : isFocus }" @click="handleBack">取消</div>
@@ -12,7 +12,14 @@
   export default {
     name: 'z-search',
     props: {
-      placeholder: String
+      placeholder: {
+        type: String,
+        required: true
+      },
+      onSearch: {
+        type: Function,
+        default: function() {}
+      }
     },
     data() {
       return {
@@ -30,16 +37,23 @@
     },
     methods: {
       handleFocus() {
+        // 进入input焦点，出现close和取消
         this.isFocus = true;
       },
       handleClean() {
+        // 点击close后清空vlaue后，再聚焦input框
         this.value = '';
         this.focusStatus = true;
       },
       handleBack() {
+        // 点击取消后，清空所有回复最初状态
         this.value = '';
         this.focusStatus = false;
         this.isFocus = false;
+      },
+      handleSearch(ev) {
+        // input输入回车后，发送回调
+        this.onSearch(ev.target.value)
       }
     }
   };