zhouchijian
/
fe-drone-ci
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

perf: set private property names for vue 

https://vuejs.org/v2/style-guide/index.html#Private-property-names-essential
This commit is contained in:
Pan 2019-04-12 10:53:12 +08:00
parent d0651ad2f2
commit a6be6af46d
2 changed files with 15 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
src/components/Charts/mixins/resize.js
View File

@ -3,7 +3,7 @@ import { debounce } from '@/utils'
export default { export default {
data() { data() {
return { return {
sidebarElm: null $_sidebarElm: null
} }
}, },
mounted() { mounted() {
@ -14,16 +14,18 @@ export default {
}, 100) }, 100)
window.addEventListener('resize', this.__resizeHandler) window.addEventListener('resize', this.__resizeHandler)
this.sidebarElm = document.getElementsByClassName('sidebar-container')[0] this.$_sidebarElm = document.getElementsByClassName('sidebar-container')[0]
this.sidebarElm && this.sidebarElm.addEventListener('transitionend', this.sidebarResizeHandler) this.$_sidebarElm && this.$_sidebarElm.addEventListener('transitionend', this.$_sidebarResizeHandler)
}, },
beforeDestroy() { beforeDestroy() {
window.removeEventListener('resize', this.__resizeHandler) window.removeEventListener('resize', this.__resizeHandler)
this.sidebarElm && this.sidebarElm.removeEventListener('transitionend', this.sidebarResizeHandler) this.$_sidebarElm && this.$_sidebarElm.removeEventListener('transitionend', this.$_sidebarResizeHandler)
}, },
methods: { methods: {
sidebarResizeHandler(e) { // use $_ for mixins properties
// https://vuejs.org/v2/style-guide/index.html#Private-property-names-essential
$_sidebarResizeHandler(e) {
if (e.propertyName === 'width') { if (e.propertyName === 'width') {
this.__resizeHandler() this.__resizeHandler()
} }

14
src/layout/mixin/ResizeHandler.js
View File

@ -12,26 +12,28 @@ export default {
} }
}, },
beforeMount() { beforeMount() {
window.addEventListener('resize', this.resizeHandler) window.addEventListener('resize', this.$_resizeHandler)
}, },
beforeDestroy() { beforeDestroy() {
window.removeEventListener('resize', this.resizeHandler) window.removeEventListener('resize', this.$_resizeHandler)
}, },
mounted() { mounted() {
const isMobile = this.isMobile() const isMobile = this.$_isMobile()
if (isMobile) { if (isMobile) {
store.dispatch('app/toggleDevice', 'mobile') store.dispatch('app/toggleDevice', 'mobile')
store.dispatch('app/closeSideBar', { withoutAnimation: true }) store.dispatch('app/closeSideBar', { withoutAnimation: true })
} }
}, },
methods: { methods: {
isMobile() { // use $_ for mixins properties
// https://vuejs.org/v2/style-guide/index.html#Private-property-names-essential
$_isMobile() {
const rect = body.getBoundingClientRect() const rect = body.getBoundingClientRect()
return rect.width - 1 < WIDTH return rect.width - 1 < WIDTH
}, },
resizeHandler() { $_resizeHandler() {
if (!document.hidden) { if (!document.hidden) {
const isMobile = this.isMobile() const isMobile = this.$_isMobile()
store.dispatch('app/toggleDevice', isMobile ? 'mobile' : 'desktop') store.dispatch('app/toggleDevice', isMobile ? 'mobile' : 'desktop')
if (isMobile) { if (isMobile) {