VUE單頁面切換動畫(全網最好的切換效果)
阿新 • • 發佈:2019-02-12
import '@/assets/iconfont/iconfont.css'
import { Loading, TransferDom } from 'vux'
import {mapState} from 'vuex'
import noNetwork from '@/page/system/callback/noNetwork.vue'
export default {
directives: {
TransferDom
},
computed: {
...mapState({
isLoading: state => state.isLoading,
direction: state => state.direction,
isNetworkOnline: state => state.isNetworkOnline
})
},
// dynamically set transition based on route change
watch: {
'$route' (to, from) {
if (this.direction === 'forward') {
this.viewAnimate = 'slide-left'
} else {
this.viewAnimate = 'slide-right'
}
}
},
data () {
return {
viewAnimate: 'slide-left'
}
},
components: {
Loading,
noNetwork
}
}