<template>
	<div id="app">
		<router-view />
	</div>
</template>

<script>
	import {
		mapGetters,
		mapMutations
	} from 'vuex'
	export default {
		name: 'Home',
		created() {},
		methods: {
			removeElement(element) {
				for (var i = 0; i < element.length; i++) {
					console.log(element[i]);
					document.body.removeChild(element[i]);
				}
			}
		},
		mounted() {
			mui('body').on('tap', '.kfz', function() {
				mui.toast('开发中');
			});
			mui('body').on('tap', '.jump', function() {
				document.location.href = this.href;
			});
		},
		watch: {
			//解决系统返回键app外的元素仍然存在的问题
			'$route': function(to, from) {
				var muidtpicker = document.getElementsByClassName('mui-dtpicker mui-active');
				var muibackdrop = document.getElementsByClassName('mui-backdrop');
				var muipoppicker = document.getElementsByClassName('mui-poppicker mui-active');
				if (muidtpicker) {
					this.removeElement(muidtpicker);
					//console.log(muidtpicker)
				}
				if (muibackdrop) {
					this.removeElement(muibackdrop);
					//console.log(muibackdrop)
				}
				if (muipoppicker) {
					this.removeElement(muipoppicker);
					//console.log(muibackdrop)
				}
			}
		},
	}
</script>

<style lang="scss">
	#app {
		font-family: Avenir, Helvetica, Arial, sans-serif;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
	}

	.kfz,
	.kfz a,
	.kfz span,
	.kfz p,
	.kfz div {
		color: #ddd !important;
	}
</style>
