Mercurial > gemma
changeset 1044:f8a4ec146d47
fixed Vue reactivity issue (splitscreen button)
| author | Markus Kottlaender <markus@intevation.de> |
|---|---|
| date | Thu, 25 Oct 2018 10:22:30 +0200 |
| parents | 740679d6682f |
| children | 505ec57929aa |
| files | client/src/application/Topbar.vue client/src/fairway/store.js |
| diffstat | 2 files changed, 7 insertions(+), 3 deletions(-) [+] |
line wrap: on
line diff
--- a/client/src/application/Topbar.vue Thu Oct 25 08:05:06 2018 +0200 +++ b/client/src/application/Topbar.vue Thu Oct 25 10:22:30 2018 +0200 @@ -18,7 +18,7 @@ </ul> </div> </div> - <div v-if="routeName == 'mainview' && currentProfile.length" class="splitbutton"> + <div v-if="routeName == 'mainview' && Object.keys(currentProfile).length" class="splitbutton"> <i @click="splitScreen" class="ui-element splitscreen fa fa-window-restore shadow"></i> </div> <div class=""> @@ -236,7 +236,7 @@ this.$store.commit("application/toggleSidebar"); }, splitScreen() { - if (this.currentProfile.length == 0) return; + if (Object.keys(this.currentProfile).length == 0) return; this.$store.commit("application/toggleSplitScreen"); } }
--- a/client/src/fairway/store.js Thu Oct 25 08:05:06 2018 +0200 +++ b/client/src/fairway/store.js Thu Oct 25 10:22:30 2018 +0200 @@ -11,7 +11,9 @@ * * Author(s): * Thomas Junk <thomas.junk@intevation.de> + * Markus Kottländer <markuks.kottlaender@intevation.de> */ +import Vue from "vue"; import { HTTP } from "../application/lib/http"; import { prepareProfile } from "../application/lib/geo"; import LineString from "ol/geom/LineString.js"; @@ -58,7 +60,9 @@ const endPoint = state.endPoint; const geoJSON = data; const result = prepareProfile({ geoJSON, startPoint, endPoint }); - state.currentProfile[surveyDate] = result.points; + // Use Vue.set() to make new object properties rective + // https://vuejs.org/v2/guide/reactivity.html#Change-Detection-Caveats + Vue.set(state.currentProfile, surveyDate, result.points); state.minAlt = result.minAlt; state.maxAlt = result.maxAlt; state.totalLength = result.lengthPolyLine;