How to bind this in then callback in Vuex - vue.js

Question

I am using Vuex in my app. I dispatch an action inside the component. I get back the result in then(). I need to assign part of that result to some local variables defined in the Vue component. I am only able to do this if I bind the then() with this. Is there a way to achieve the same without using bind.
Here is my original code, I am talking about the line this.$store.dispatch:
<script>
/* eslint-disable */
import * as d3 from 'd3'
import FlightCard from './FlightCard'
export default {
name: 'AirportLayout',
components: {FlightCard},
props: ['id'],
data () {
return {
cardActivator: null
}
},
methods: {
// show flight card menu
showFlightCard: function (e) {
// debugger
let flight = this.$store.state.demo.find(a => {
return a.flightNr === e.target.id
})
this.$store.dispatch('getFlightCard', {flightNr: flight.flightNr, scheduledDate: flight.scheduledDate}).then(function (){
debugger
// here I want to do something with the response
this.cardActivator = document.getElementById(e.target.id)
console.log('Showing flight card for: ', this.cardActivator)
}.bind(this)) // Using bind, this gets the value of Vue component
}
}
}
</script>
I read the documentation for arrow functions here Arrow functions, it says an arrow function does not create its own this, the this value of the enclosing execution context is used. I assumed that would be the Vue component, and I tried it, but then this value was undefined. So I concluded the execution context must be referring to the then(), am I right? If yes, how could I make this inside then() refer to the Vue component?
Here is my code using arrow functions
<script>
/* eslint-disable */
import * as d3 from 'd3'
import FlightCard from './FlightCard'
export default {
name: 'AirportLayout',
components: {FlightCard},
props: ['id'],
data () {
return {
cardActivator: null
}
},
methods: {
// show flight card menu
showFlightCard: function (e) {
// debugger
let flight = this.$store.state.demo.find(a => {
return a.flightNr === e.target.id
})
this.$store.dispatch('getFlightCard', {flightNr: flight.flightNr, scheduledDate: flight.scheduledDate}).then(r => {
debugger
// here I want to do something with the response
this.cardActivator = document.getElementById(e.target.id)
console.log('Showing flight card for: ', this.cardActivator)
}) // here the value for this is undefined
}
}
}
</script>