uniapp 商品列表搜索无效，并且下拉分页后，会刷新去掉关键字

components/Recommend.vue

@@ -6,13 +6,11 @@
 			<text class="iconfont icon-zhuangshixian lefticon"></text>
 		</view>
 		<view class="recommendList acea-row row-between-wrapper">
-			<view
+			<view @click="routerGo(item)" class="item" v-for="(item, recommendIndex) in hostProduct"
-				@click="routerGo(item)"
+				:key="recommendIndex">
-				class="item"
+				<view class="pictrue">
-				v-for="(item, recommendIndex) in hostProduct"
+					<image :src="item.image" class="image" />
-				:key="recommendIndex"
+				</view>
-			>
-				<view class="pictrue"><image :src="item.image" class="image" /></view>
 				<view class="name line1">{{ item.storeName }}</view>
 				<view class="money font-color-red">
 					￥
@@ -24,15 +22,26 @@
 	</view>
 </template>
 <script>
-import { getHostProducts } from '@/api/store';
+	import {
-import Loading from '@/components/Loading';
+		getHostProducts
-export default {
+	} from '@/api/store';
+	import Loading from '@/components/Loading';
+	export default {
 		name: 'Recommend',
-	props: {},
+		props: {
+			recommendLoading: Boolean
+		},
 		components: {
 			Loading
 		},
-	data: function() {
+		watch: {
+			recommendLoading(nextLoading) {
+				if (nextLoading) {
+					this.hostProducts()
+				}
+			}
+		},
+		data: function () {
 			return {
 				hostProduct: [],
 				page: 1,
@@ -42,14 +51,19 @@ export default {
 				loadend: false
 			};
 		},
-	mounted: function() {
+		mounted: function () {
 			this.hostProducts();
 		},
 		methods: {
 			routerGo(item) {
-			this.$yrouter.push({ path: '/pages/shop/GoodsCon/index', query: { id: item.id } });
+				this.$yrouter.push({
+					path: '/pages/shop/GoodsCon/index',
+					query: {
+						id: item.id
+					}
+				});
 			},
-		hostProducts: function() {
+			hostProducts: function () {
 				let that = this;
 				if (that.loading) return; //阻止下次请求（false可以进行请求）；
 				if (that.loadend) return; //阻止结束当前请求（false可以进行请求）；
@@ -60,11 +74,9 @@ export default {
 					that.hostProduct.push.apply(that.hostProduct, res.data);
 					that.loadend = res.data.length < that.limit; //判断所有数据是否加载完成；
 					that.page = that.page + 1;
+					this.$emit('changeRecommendLoading', false)
 				});
 			}
 		},
-	onReachBottom() {
+	};
-		!this.loading && this.hostProducts();
-	}
-};
 </script>

pages/shop/GoodsList/index.vue

@@ -3,22 +3,14 @@
     <form @submit.prevent="submitForm">
       <view class="search bg-color-red acea-row row-between-wrapper">
         <view class="input acea-row row-between-wrapper">
-          <text class="iconfont icon-sousuo"></text>
           <input placeholder="搜索商品信息" v-model="where.keyword" />
+          <text class="iconfont icon-sousuo" @click="submitForm"></text>
         </view>
-        <view
+        <view class="iconfont" :class="Switch === true ? 'icon-pailie' : 'icon-tupianpailie'" @click="switchTap"></view>
-          class="iconfont"
-          :class="Switch === true ? 'icon-pailie' : 'icon-tupianpailie'"
-          @click="switchTap"
-        ></view>
       </view>
     </form>
     <view class="nav acea-row row-middle">
-      <view
+      <view class="item" :class="title ? 'font-color-red' : ''" @click="set_where(0)">{{ title ? title : "默认" }}</view>
-        class="item"
-        :class="title ? 'font-color-red' : ''"
-        @click="set_where(0)"
-      >{{ title ? title : "默认" }}</view>
       <view class="item" @click="set_where(1)">
         价格
         <image src="@/static/images/horn.png" v-if="price === 0" />
@@ -34,19 +26,9 @@
       <!-- down -->
       <view class="item" :class="nows ? 'font-color-red' : ''" @click="set_where(3)">新品</view>
     </view>
-    <view
+    <view class="list acea-row row-between-wrapper" :class="Switch === true ? '' : 'on'" ref="container">
-      class="list acea-row row-between-wrapper"
+      <view @click="goGoodsCon(item)" class="item" :class="Switch === true ? '' : 'on'"
-      :class="Switch === true ? '' : 'on'"
+        v-for="(item, productListIndex) in productList" :key="productListIndex" :title="item.storeName">
-      ref="container"
-    >
-      <view
-        @click="goGoodsCon(item)"
-        class="item"
-        :class="Switch === true ? '' : 'on'"
-        v-for="(item, productListIndex) in productList"
-        :key="productListIndex"
-        :title="item.storeName"
-      >
         <view class="pictrue" :class="Switch === true ? '' : 'on'">
           <image :src="item.image" :class="Switch === true ? '' : 'on'" />
         </view>
@@ -64,31 +46,30 @@
       </view>
     </view>
     <Loading :loaded="loadend" :loading="loading"></Loading>
-    <view
+    <view class="noCommodity" style="background-color: #fff;" v-if="productList.length === 0 && where.page > 1">
-      class="noCommodity"
-      style="background-color: #fff;"
-      v-if="productList.length === 0 && where.page > 1"
-    >
       <view class="noPictrue">
         <image src="@/static/images/noGood.png" class="image" />
       </view>
     </view>
-    <Recommend v-if="productList.length === 0 && where.page > 1"></Recommend>
+    <Recommend v-if="productList.length === 0 && where.page > 1" :recommendLoading="recommendLoading"
+      @changeRecommendLoading="changeRecommendLoading"></Recommend>
   </view>
 </template>
 <script>
-import Recommend from "@/components/Recommend";
+  import Recommend from "@/components/Recommend";
-import { getProducts } from "@/api/store";
+  import {
-import Loading from "@/components/Loading";
+    getProducts
+  } from "@/api/store";
+  import Loading from "@/components/Loading";
 
-export default {
+  export default {
     name: "GoodsList",
     components: {
       Recommend,
       Loading
     },
     props: {},
-  data: function() {
+    data: function () {
       // const { s = "", id = 0, title = "" } = this.$yroute.query;
       const s = "",
         id = 0,
@@ -113,7 +94,8 @@ export default {
         loadend: false,
         price: 0,
         stock: 0,
-      nows: false
+        nows: false,
+        recommendLoading: false
       };
     },
     watch: {
@@ -138,12 +120,17 @@ export default {
         // }
       }
     },
-  mounted: function() {
+    mounted: function () {
-    const { s = "", id = 0, title = "" } = this.$yroute.query;
+      const {
+        s = "", id = 0, title = ""
+      } = this.$yroute.query;
+      this.where.keyword = s;
+
       this.updateTitle();
       this.get_product_list();
     },
     onReachBottom() {
+      this.recommendLoading = true;
       !this.loading && this.get_product_list();
     },
     onHide() {
@@ -167,10 +154,15 @@ export default {
       // this.nows = fals;
     },
     methods: {
+      changeRecommendLoading(recommendLoading) {
+        this.recommendLoading = recommendLoading
+      },
       goGoodsCon(item) {
         this.$yrouter.push({
           path: "/pages/shop/GoodsCon/index",
-        query: { id: item.id }
+          query: {
+            id: item.id
+          }
         });
       },
       updateTitle() {
@@ -180,9 +172,10 @@ export default {
         var that = this;
         this.setWhere();
         // if (to.name !== "GoodsList") return;
-      const { s = "", id = 0, title = "" } = this.$yroute.query;
+        const {
+          s = "", id = 0, title = ""
+        } = this.$yroute.query;
         if (s !== this.where.keyword || id !== this.where.sid) {
-        this.where.keyword = s;
           this.loadend = false;
           this.loading = false;
           this.where.page = 1;
@@ -202,7 +195,7 @@ export default {
           that.where.page = that.where.page + 1;
         });
       },
-    submitForm: function() {
+      submitForm: function () {
         this.$set(this, "productList", []);
         this.where.page = 1;
         this.loadend = false;
@@ -210,11 +203,13 @@ export default {
         this.get_product_list();
       },
       //点击事件处理
-    set_where: function(index) {
+      set_where: function (index) {
         let that = this;
         switch (index) {
           case 0:
-          return that.$yrouter.push({ path: "/pages/shop/GoodsClass/index" });
+            return that.$yrouter.push({
+              path: "/pages/shop/GoodsClass/index"
+            });
           case 1:
             if (that.price === 0) that.price = 1;
             else if (that.price === 1) that.price = 2;
@@ -239,7 +234,7 @@ export default {
         that.get_product_list();
       },
       //设置where条件
-    setWhere: function() {
+      setWhere: function () {
         let that = this;
         if (that.price === 0) {
           that.where.priceOrder = "";
@@ -257,16 +252,16 @@ export default {
         }
         that.where.news = that.nows ? "1" : "0";
       },
-    switchTap: function() {
+      switchTap: function () {
         let that = this;
         that.Switch = !that.Switch;
       }
     }
-};
+  };
 </script>
 <style scoped lang="less">
-.noCommodity {
+  .noCommodity {
     border-top: 3px solid #f5f5f5;
     padding-bottom: 1px;
-}
+  }
 </style>