H5-Spu-detail/src/App.vue

<template>
  <div id="app">
    <component ts :is="componentName"></component>
  </div>
</template>

<script>
import PddDetail from './components/pdd-detail.vue'
import JdDetail from './components/jd-detail.vue'
import TbDetail from './components/tb-detail.vue'
export default {
  name: 'App',
  components: {
    PddDetail,
    JdDetail,
    TbDetail
  },
  data() {
    return {
      platform: "",
      componentName: null
    }
  },
  mounted() {
    this.platform = this.GetQueryString('platform')
    switch (this.platform) {
      case 'pdd':
        this.componentName = PddDetail
        break;
      case 'jd':
        this.componentName = JdDetail
        break;
      case 'tb':
        this.componentName = TbDetail
        break;
      default:
        break;
    }
    console.log('11111',this.componentName);

  },
  methods: {
    GetQueryString(name) {
      var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
      var r = window.location.search.substr(1).match(reg);
      if (r != null) return unescape(r[2]);
      return null;
    },
  }
}
</script>

<style>
#app {
  margin: 0px;
  padding: 0px;
}
</style>