title: vue-router beforeRouteUpdate hook can't access `this`
body: <p>I'm building a Vue.js application using vue-router.</p>
  
  <p>From the <a href="https://router.vuejs.org/guide/advanced/navigation-guards.html#in-component-guards" rel="nofollow noreferrer">doc</a> I can read that inside the hook <code>beforeRouteUpdate</code> I have full access to the component through the keyword <code>this</code>:</p>
  
  <blockquote>
    <p>Note that beforeRouteEnter is the only guard that supports passing a
    callback to next. For beforeRouteUpdate and beforeRouteLeave, this is
    already available, so passing a callback is unnecessary and therefore
    not supported:</p>
  </blockquote>
  
  <p>So I wrote the following code:</p>
  
  <pre><code>    ...
      methods: {
        ...mapActions({
          setFileDetails: 'setFileDetails',
          setActionParams: 'setActionParams',
          setSelectedFileId: 'setSelectedFileId',
        }),
        goToImportSource() {
          this.$router.push('/import');
        },
        openAnnotationsView(item) {
          this.$router.push(`/ingestion/queue/${item.id}`);
        },
      },
      beforeRouteUpdate: (
        to,
        from,
        next,
      ) =&gt; {
        this.setSelectedFileId(to.params.id);
        next();
      },
    };
  &lt;/script&gt;
  </code></pre>
  
  <p>But I get this error:</p>
  
  <pre><code>vue-router.esm.js?fe87:16 [vue-router] uncaught error during route navigation:
  
  TypeError: _this.setSelectedFileId is not a function
      at VueComponent.beforeRouteUpdate (PageIngestionQueue.vue?3869:67)
      at boundRouteGuard (vue-router.esm.js?fe87:2080)
      at iterator (vue-router.esm.js?fe87:1943)
      at step (vue-router.esm.js?fe87:1717)
      at step (vue-router.esm.js?fe87:1721)
      at step (vue-router.esm.js?fe87:1721)
      at step (vue-router.esm.js?fe87:1721)
      at eval (vue-router.esm.js?fe87:1718)
      at eval (vue-router.esm.js?fe87:1964)
      at eval (routeRules.js?b464:9)
  </code></pre>
  
  <p>If I call <code>this.setSelectedFileId</code> anywhere else in the component it works...what am I missing?</p>