make with-load-more not use computeds when they don't work for it

1 files changed, 10 insertions, 6 deletions

diff --git a/src/hocs/with_load_more/with_load_more.js b/src/hocs/with_load_more/with_load_more.js
index 7df9dbb2..671b2b6f 100644
--- a/src/hocs/with_load_more/with_load_more.js
+++ b/src/hocs/with_load_more/with_load_more.js
@@ -29,12 +29,8 @@ const withLoadMore = ({
       return {
         loading: false,
         bottomedOut: false,
-        error: false
-      }
-    },
-    computed: {
-      entries () {
-        return select(this.$props, this.$store) || []
+        error: false,
+        entries: []
       }
     },
     created () {
@@ -48,6 +44,11 @@ const withLoadMore = ({
       destroy && destroy(this.$props, this.$store)
     },
     methods: {
+      // Entries is not a computed because computed can't track the dynamic
+      // selector for changes and won't trigger after fetch.
+      updateEntries () {
+        this.entries = select(this.$props, this.$store) || []
+      },
       fetchEntries () {
         if (!this.loading) {
           this.loading = true
@@ -61,6 +62,9 @@ const withLoadMore = ({
               this.loading = false
               this.error = true
             })
+            .finally(() => {
+              this.updateEntries()
+            })
         }
       },
       scrollLoad (e) {