Charts: Force re-render on device orientation change (#2706)
Fixes #2702.
Signed-off-by: Florian Hotze <florianh_dev@icloud.com>
(cherry picked from commit f7f04bf18c
)
4.2.x
parent
0aae365b6f
commit
668538eb9f
|
@ -1,5 +1,6 @@
|
||||||
<template>
|
<template>
|
||||||
<oh-chart
|
<oh-chart
|
||||||
|
v-if="!rerender"
|
||||||
class="oh-chart-page-chart"
|
class="oh-chart-page-chart"
|
||||||
:class="{ 'with-tabbar': context.tab, 'with-toolbar': context.analyzer }"
|
:class="{ 'with-tabbar': context.tab, 'with-toolbar': context.analyzer }"
|
||||||
:style="(this.$f7.data.themeOptions.dark === 'dark') ? 'background-color: black;' : 'background-color: white;'"
|
:style="(this.$f7.data.themeOptions.dark === 'dark') ? 'background-color: black;' : 'background-color: white;'"
|
||||||
|
@ -31,6 +32,25 @@ export default {
|
||||||
components: {
|
components: {
|
||||||
OhChart
|
OhChart
|
||||||
},
|
},
|
||||||
widget: OhChartPageDefinition
|
widget: OhChartPageDefinition,
|
||||||
|
data () {
|
||||||
|
return {
|
||||||
|
rerender: false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
onOrientationChange () {
|
||||||
|
this.rerender = true
|
||||||
|
this.$nextTick(() => {
|
||||||
|
this.rerender = false
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted () {
|
||||||
|
window.addEventListener('orientationchange', this.onOrientationChange)
|
||||||
|
},
|
||||||
|
beforeUnmount () {
|
||||||
|
window.removeEventListener('orientationchange', this.onOrientationChange)
|
||||||
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
Loading…
Reference in New Issue