brand.vue 1.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778
  1. <!-- 品牌列表 -->
  2. <template>
  3. <view class="container">
  4. <uni-indexed-list :options="brandList" :showSelect="false" v-on:getData="getData" :hasMore="hasMore"></uni-indexed-list>
  5. <!-- <loadingState v-if="loadingState == 'first_loading'||brandList.length > 0" :state='loadingState'/> -->
  6. </view>
  7. </template>
  8. <script>
  9. import {
  10. mapMutations
  11. } from 'vuex';
  12. import uniIndexedList from "@/components/uni-indexed-list/uni-indexed-list.vue";
  13. import loadingState from "@/components/loading-state.vue";
  14. export default {
  15. components: {
  16. uniIndexedList,
  17. loadingState
  18. },
  19. data() {
  20. return {
  21. brandList: [],
  22. current:1,
  23. pageSize:10,
  24. hasMore:false, //是否有更多
  25. loadingState: 'first_loading',
  26. }
  27. },
  28. onLoad() {
  29. this.getData();
  30. },
  31. methods: {
  32. //获取品牌列表
  33. getData() {
  34. this.$request({
  35. url: 'v3/goods/front/goods/goodsBrandList',
  36. data:{
  37. current:this.current,
  38. pageSize:this.pageSize
  39. }
  40. }).then(res => {
  41. if (res.state == 200) {
  42. let result = res.data;
  43. if(this.current == 1){
  44. this.brandList = result.list;
  45. }else{
  46. this.brandList = this.brandList.concat(result.list)
  47. }
  48. this.hasMore = this.$checkPaginationHasMore(result.pagination); //是否还有数据
  49. if (this.hasMore) {
  50. this.current++;
  51. this.loadingState = 'allow_loading_more';
  52. } else {
  53. this.loadingState = 'no_more_data';
  54. }
  55. } else {
  56. this.$api.msg(res.msg);
  57. }
  58. }).catch((e) => {
  59. //异常处理
  60. })
  61. },
  62. },
  63. }
  64. </script>
  65. <style lang='scss'>
  66. page {
  67. background: $bg-color-split;
  68. }
  69. .container{
  70. width: 750rpx;
  71. margin: 0 auto;
  72. }
  73. </style>