首页添加下拉刷新

src/views/home/index.vue

@@ -14,6 +14,7 @@
       </div>
     </nafm-header>
     <main>
+      <NafmPullRefresh v-model="refresh" @refresh="fetchData">
         <HomeBanner :data="HomeData" />
         <MenuModule :data="HomeData" />
         <HotScrollBar :data="HomeData" />
@@ -26,19 +27,21 @@
           @clickItem="handleItem"
           @clickTop="handleTop(item)"
         />
+      </NafmPullRefresh>
     </main>
   </div>
 </template>
 <script>
 import { mapState } from "vuex";
 import SearchInput from '@/components/SearchInput'
+import NafmPullRefresh from '@/components/NafmPullRefresh'
 import HomeBanner from './components/HomeBanner'
 import MenuModule from './components/MenuModule'
 import HotScrollBar from './components/HotScrollBar'
 import DataModule from '@/components/HomeDataListModule'
 export default {
   name: "Home",
-  components: { HomeBanner, MenuModule, HotScrollBar, DataModule, SearchInput },
+  components: { NafmPullRefresh, HomeBanner, MenuModule, HotScrollBar, DataModule, SearchInput },
   data () {
     const datas = [
       {
@@ -61,6 +64,7 @@ export default {
       }
     ]
     return {
+      refresh: false,
       modules: [
         { type: '1', name: this.$t('home.disclosure'), dateText: this.$t('home.disclosureDate'), datas, showTop: false },
         { type: '2', name: this.$t('home.news'), dateText: this.$t('home.updateDate'), datas, showTop: true },
@@ -81,6 +85,12 @@ export default {
       this.$router.push({ name: 'GlobalSearch' })
     },
 
+    fetchData () {
+      this.$store.dispatch('home/AGetHomeData').then(res => {
+        this.refresh = false
+      })
+    },
+
     handleTop (module) {
       const modules = []
       for (const item of this.modules) {
@@ -99,7 +109,7 @@ export default {
     }
   },
   mounted () {
-    this.$store.dispatch('home/AGetHomeData')
+    this.fetchData()
   }
 };
 </script>