vue-platform

vue-platform是一个Vue插件，区分PC端和H5移动端，支持针对不同端展示不同的视图层

使用背景

1、对于已有的PC项目，想对系统中某一部分模块移动化（业务逻辑基本一致，只有视图层存在差异），为了提高开发效率，决定在原代码结构上进行开发，复用原有 URL 和业务逻辑，只需开发视图层即可

2、使用 vue-platform 插件区分PC端和H5移动端，针对不同端动态加载不同的 Vue 组件来切换视图层

实现

使用

安装

$ npm install vue-platform

使用

app.js

import vuePlatform from 'vue-platform';

Vue.use(vuePlatform);

middle.vue

<template>
    <component :is="content"></component>
</template>

<script>
    import pc from './pc.vue';
    import mobile from './mobile.vue';

    export default {
        data () {
            return {
                content: 'pc',
            };
        },
        created () {
            if (this.$platform === '2') {
                this.content = 'mobile';
            }
        },
        components: {
            pc,
            mobile,
        },
    };
</script>