由于 pcHome 和 mvHome 里面都用到了 swiper 插件，所以用 v-if 老是出来一堆堆的红色错误，虽然程序照常运行，但是那一堆报错我就受不了，后来切换了 v-show 本地运行是好的，换安卓手机访问也是好的，用了一个 苹果手机 访问之后就出问题了，组件内的东西都显示不出来，用 vConsole 调试工具查看 html 结构，结构都有，就是不展示，这可急死我了，以前也没碰到这么个诡异的事情呐（估计跟这两个组件太大有关系吧，不确定）
以前用 v-show 来回切换局部页面用着很舒服哒，头一次将 v-show 作用到自定义组件上，心里也直打鼓，终于…在 vue 的官网上看到了方法：【动态组件】

还有一个完整的 demo 供参考，真好~【看demo】

哎嘿？动态组件还真的是…不是我那么搞的哈，去改改代码试试？？？




然后去苹果手机上预览一下，啊哈 真的好了 perfect
将这个例子记录一下：

<div class="index-home">
	<component :is="currentComponent"></component><!-- 修改之后是这么用的 -->
	<!-- <pc-home v-show="!miniScreen"></pc-home>
	<mv-home v-show="miniScreen"></mv-home> -->
</div>

import pcHome from './pc/home';
import mvHome from './mv/home';
export default {
	components:{
		pcHome,
		mvHome
	},
	data() {
		return {
			miniScreen:false, //以前的废物
			nowComp:'pc' //修改之后的
		};
	},
	computed:{
		currentComponent:function(){
			return this.nowComp + '-home'
		}
	},
	mounted() {
		this.init();
	},
	methods: {
		init() {
			let clientInfo = clientXY();
			this.screenW = clientInfo.width;
			this.screenH = clientInfo.height;
			if (this.screenW >= 751) {
				//this.miniScreen = false;
				this.nowComp = 'pc'
			} else {
				//this.miniScreen = true;
				this.nowComp = 'mv'
			}
		}
	}
};