Init project

pkg_product/views/famousStory.vue

@@ -0,0 +1,60 @@
+<template>
+  <view class="famous-story">
+    <image class="img" :src="item.image" mode="scaleToFill" v-for="item in list" @click="goHot(item)"/>
+  </view>
+</template>
+
+<script>
+import {getStoryList} from "@/api/product";
+
+export default {
+  name: "famousStory",
+  data() {
+    return {
+      page: 1, // 当前页
+      pages: 1, // 总页数
+      list: []
+    }
+  },
+  onLoad() {
+    this.fetchData();
+  },
+  onReachBottom() {
+    if (this.page < this.pages) {
+      this.page++;
+      this.fetchData();
+    }
+  },
+  methods: {
+    fetchData() {
+      getStoryList(this.page).then(({data}) => {
+        this.pages = data.pages;
+        if (data.records.length > 0) {
+          for (let i = 0; i < data.records.length; i++) {
+            this.list.push(data.records[i]);
+          }
+        }
+      })
+    },
+    goHot(item) {
+      uni.navigateTo({
+        url: "/pkg_product/views/famousHot?id=" + item.id
+      })
+    }
+  }
+}
+</script>
+
+<style scoped lang="less">
+.famous-story {
+  padding-top: 20rpx;
+  background: #fff;
+
+  .img {
+    width: 686rpx;
+    height: 440rpx;
+    margin: 0 32rpx 32rpx;
+    border-radius: 20rpx;
+  }
+}
+</style>