我正在使用Vue 2.0开发SPA。到目前为止，开发的组件是针对“桌面”浏览器的，例如，
Main.vue，ProductList.vue，ProductDetail.vue，
我想要移动浏览器的另一组组件，例如MainMobile.vue，ProductListMobile.vue，ProductDetailMobile.vue，
我的问题是，在移动浏览器中查看时，我应该在哪里以及如何使SPA渲染组件的移动版本？
请注意，我明确希望避免使我的组件具有响应能力。我想保留两个单独的版本。
谢谢，
显示用于移动浏览器的不同Vuejs组件
我有Vue.js的简单解决方案：
<div v-if="!isMobile()">
<desktop>
</desktop>
</div>
<div v-else>
<mobile>
</mobile>
</div>
和方法：
methods: {
isMobile() {
if(/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)) {
return true
} else {
return false
}
}
}
我有一个主意，请使用可检测到浏览器是移动设备还是台式机的mixin（此答案中 js代码示例）。然后使用v-if，例如
所以这是https://jsfiddle.net/Ldku0xec/上的示例