修改样式

components/searchSelectWrapper/index.js

@@ -7,14 +7,23 @@ Component({
   properties: {
     label: String,
     placeholder: String,
-    text: String
+    text: String,
+    fieldType: {
+      type: String,
+      value: "text"
+    },
+    type: {
+      type: String,
+      value: "select"
+    }
   },
 
   /**
    * 组件的初始数据
    */
   data: {
-
+    keyword: "",
+    text: "",
   },
 
   /**
@@ -23,6 +32,17 @@ Component({
   methods: {
     onSearch() {
       this.triggerEvent("search")
+    },
+    onChangeKeyword(e) {
+      this.setData({ keyword: e.detail });
+    },
+    onChangeText(e) {
+      this.setData({ text: e.detail });
+      this.triggerEvent("changeText", e.detail)
+    },
+    onSearchKeyword() {
+      this.triggerEvent("searchKeyword", this.data.keyword)
+      this.setData({ keyword: "" })
     }
   }
 })

components/searchSelectWrapper/index.json

@@ -1,6 +1,8 @@
 {
   "component": true,
   "usingComponents": {
-    "van-icon": "@vant/weapp/icon/index"
+    "van-icon": "@vant/weapp/icon/index",
+    "van-button": "@vant/weapp/button/index",
+    "van-field": "@vant/weapp/field/index"
   }
 }

components/searchSelectWrapper/index.wxml

@@ -1,9 +1,35 @@
 <!--components/searchSelectWrapper/index.wxml-->
-<view class="wrapper">
-    <view> {{ label }} </view>
+<view class="wrapper" wx:if="{{type === 'select'}}">
+    <view class="label"> {{ label }} </view>
     <view class="content" bind:tap="clickTime" bind:tap="onSearch">
         <view class="text" wx:if="{{!text}}" style="color: #ccc;"> {{placeholder}} </view>
         <view class="text" wx:else> {{text}} </view>
         <van-icon name="arrow-down" />
     </view>
+</view>
+<view class="wrapper" wx:if="{{type === 'inputSearch'}}">
+    <view class="label"> {{ label }} </view>
+    <view class="inputContent" bind:tap="clickTime">
+        <van-field
+            value="{{ value }}"
+            placeholder="{{placeholder}}"
+            border="{{ false }}"
+            bind:change="onChangeKeyword"
+            custom-style="padding: 0;font-size: 30rpx;line-height: 32rpx;"
+        />
+    </view>
+    <van-button type="info" size="small" bind:click="onSearchKeyword"> 搜索 </van-button>
+</view>
+<view class="wrapper" wx:if="{{type === 'input'}}">
+    <view class="label"> {{ label }} </view>
+    <view class="inputContent" bind:tap="clickTime">
+        <van-field
+            value="{{ value }}"
+            placeholder="{{placeholder}}"
+            border="{{ false }}"
+            type="fieldType"
+            bind:change="onChangeText"
+            custom-style="padding: 0;font-size: 30rpx;line-height: 32rpx;"
+        />
+    </view>
 </view>

components/searchSelectWrapper/index.wxss

@@ -16,7 +16,22 @@
     border: 1rpx solid #ccc;
     background-color: #fff;
 }
+
+.inputContent {
+    flex: 1;
+    margin-left: 30rpx;
+    margin-right: 30rpx;
+    display: flex;
+    padding: 0 20rpx;
+    border-radius: 12rpx;
+    border: 1rpx solid #ccc;
+    background-color: #fff;
+}
   
 .text {
     flex: 1;
+}
+
+.label {
+    width: 120rpx;
 }