Browse Source

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

master
Gao xiaosong 4 years ago
parent
commit
d267396a7b
  1. 38
      components/Recommend.vue
  2. 69
      pages/shop/GoodsList/index.vue

38
components/Recommend.vue

@ -6,13 +6,11 @@
<text class="iconfont icon-zhuangshixian lefticon"></text> <text class="iconfont icon-zhuangshixian lefticon"></text>
</view> </view>
<view class="recommendList acea-row row-between-wrapper"> <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="name line1">{{ item.storeName }}</view>
<view class="money font-color-red"> <view class="money font-color-red">
@ -24,14 +22,25 @@
</view> </view>
</template> </template>
<script> <script>
import { getHostProducts } from '@/api/store'; import {
getHostProducts
} from '@/api/store';
import Loading from '@/components/Loading'; import Loading from '@/components/Loading';
export default { export default {
name: 'Recommend', name: 'Recommend',
props: {}, props: {
recommendLoading: Boolean
},
components: { components: {
Loading Loading
}, },
watch: {
recommendLoading(nextLoading) {
if (nextLoading) {
this.hostProducts()
}
}
},
data: function () { data: function () {
return { return {
hostProduct: [], hostProduct: [],
@ -47,7 +56,12 @@ export default {
}, },
methods: { methods: {
routerGo(item) { 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; let that = this;
@ -60,11 +74,9 @@ export default {
that.hostProduct.push.apply(that.hostProduct, res.data); that.hostProduct.push.apply(that.hostProduct, res.data);
that.loadend = res.data.length < that.limit; // that.loadend = res.data.length < that.limit; //
that.page = that.page + 1; that.page = that.page + 1;
this.$emit('changeRecommendLoading', false)
}); });
} }
}, },
onReachBottom() {
!this.loading && this.hostProducts();
}
}; };
</script> </script>

69
pages/shop/GoodsList/index.vue

@ -3,22 +3,14 @@
<form @submit.prevent="submitForm"> <form @submit.prevent="submitForm">
<view class="search bg-color-red acea-row row-between-wrapper"> <view class="search bg-color-red acea-row row-between-wrapper">
<view class="input 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" /> <input placeholder="搜索商品信息" v-model="where.keyword" />
<text class="iconfont icon-sousuo" @click="submitForm"></text>
</view> </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> </view>
</form> </form>
<view class="nav acea-row row-middle"> <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)"> <view class="item" @click="set_where(1)">
价格 价格
<image src="@/static/images/horn.png" v-if="price === 0" /> <image src="@/static/images/horn.png" v-if="price === 0" />
@ -34,19 +26,9 @@
<!-- down --> <!-- down -->
<view class="item" :class="nows ? 'font-color-red' : ''" @click="set_where(3)">新品</view> <view class="item" :class="nows ? 'font-color-red' : ''" @click="set_where(3)">新品</view>
</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'"> <view class="pictrue" :class="Switch === true ? '' : 'on'">
<image :src="item.image" :class="Switch === true ? '' : 'on'" /> <image :src="item.image" :class="Switch === true ? '' : 'on'" />
</view> </view>
@ -64,21 +46,20 @@
</view> </view>
</view> </view>
<Loading :loaded="loadend" :loading="loading"></Loading> <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"> <view class="noPictrue">
<image src="@/static/images/noGood.png" class="image" /> <image src="@/static/images/noGood.png" class="image" />
</view> </view>
</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> </view>
</template> </template>
<script> <script>
import Recommend from "@/components/Recommend"; import Recommend from "@/components/Recommend";
import { getProducts } from "@/api/store"; import {
getProducts
} from "@/api/store";
import Loading from "@/components/Loading"; import Loading from "@/components/Loading";
export default { export default {
@ -113,7 +94,8 @@ export default {
loadend: false, loadend: false,
price: 0, price: 0,
stock: 0, stock: 0,
nows: false nows: false,
recommendLoading: false
}; };
}, },
watch: { watch: {
@ -139,11 +121,16 @@ 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.updateTitle();
this.get_product_list(); this.get_product_list();
}, },
onReachBottom() { onReachBottom() {
this.recommendLoading = true;
!this.loading && this.get_product_list(); !this.loading && this.get_product_list();
}, },
onHide() { onHide() {
@ -167,10 +154,15 @@ export default {
// this.nows = fals; // this.nows = fals;
}, },
methods: { methods: {
changeRecommendLoading(recommendLoading) {
this.recommendLoading = recommendLoading
},
goGoodsCon(item) { goGoodsCon(item) {
this.$yrouter.push({ this.$yrouter.push({
path: "/pages/shop/GoodsCon/index", path: "/pages/shop/GoodsCon/index",
query: { id: item.id } query: {
id: item.id
}
}); });
}, },
updateTitle() { updateTitle() {
@ -180,9 +172,10 @@ export default {
var that = this; var that = this;
this.setWhere(); this.setWhere();
// if (to.name !== "GoodsList") return; // 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) { if (s !== this.where.keyword || id !== this.where.sid) {
this.where.keyword = s;
this.loadend = false; this.loadend = false;
this.loading = false; this.loading = false;
this.where.page = 1; this.where.page = 1;
@ -214,7 +207,9 @@ export default {
let that = this; let that = this;
switch (index) { switch (index) {
case 0: case 0:
return that.$yrouter.push({ path: "/pages/shop/GoodsClass/index" }); return that.$yrouter.push({
path: "/pages/shop/GoodsClass/index"
});
case 1: case 1:
if (that.price === 0) that.price = 1; if (that.price === 0) that.price = 1;
else if (that.price === 1) that.price = 2; else if (that.price === 1) that.price = 2;

Loading…
Cancel
Save