Loki
/
fish-uniapp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

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

master
Gao xiaosong 5 years ago
parent
e7dccf1572
commit
d267396a7b
2 changed files with 265 additions and 258 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 50
      components/Recommend.vue
  2. 93
      pages/shop/GoodsList/index.vue

50
components/Recommend.vue
Unescape View File

@ -6,13 +6,11 @@
<text class="iconfont icon-zhuangshixian lefticon"></text>
</view>
<view class="recommendList acea-row row-between-wrapper">
<view
@click="routerGo(item)"
class="item"
v-for="(item, recommendIndex) in hostProduct"
:key="recommendIndex"
>
<view class="pictrue"><image :src="item.image" class="image" /></view>
<view @click="routerGo(item)" class="item" v-for="(item, recommendIndex) in hostProduct"
:key="recommendIndex">
<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 Loading from '@/components/Loading';
export default {
import {
getHostProducts
} 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>

93
pages/shop/GoodsList/index.vue
Unescape View File

@ -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
class="iconfont"
:class="Switch === true ? 'icon-pailie' : 'icon-tupianpailie'"
@click="switchTap"
></view>
<view class="iconfont" :class="Switch === true ? 'icon-pailie' : 'icon-tupianpailie'" @click="switchTap"></view>
</view>
</form>
<view class="nav acea-row row-middle">
<view
class="item"
:class="title ? 'font-color-red' : ''"
@click="set_where(0)"
>{{ title ? title : "默认" }}</view>
<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
class="list acea-row row-between-wrapper"
:class="Switch === true ? '' : 'on'"
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="list acea-row row-between-wrapper" :class="Switch === true ? '' : 'on'" 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
class="noCommodity"
style="background-color: #fff;"
v-if="productList.length === 0 && where.page > 1"
>
<view 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 { getProducts } from "@/api/store";
import Loading from "@/components/Loading";
import Recommend from "@/components/Recommend";
import {
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() {
const { s = "", id = 0, title = "" } = this.$yroute.query;
mounted: function () {
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>

Write Preview
Loading…
Cancel
Save