Vue组件实现百度地图弹窗，Vue组件插入节点

今天碰巧有位朋友提到了这个问题，记录一下。如今很多人习惯了用主流MVVM框架开发，但是碰到如百度弹窗的这个需求的时候，不知道该如何把vue组件与第三方插件混合使用。其实这类问题都可以通过插入节点的方式实现。

案例是使用的vue框架，话不多说，直接上代码。

<template>
  <div class="map-window" v-if="show">
    <div class="header">
      <i class="el-icon-circle-close" @click="show=false"></i>
    </div>
    <router-link :to="{name:'About'}">About</router-link>
  </div>
</template>

<script>
export default {
  data: () => ({
    show: true // 控制关闭弹窗
  })
}
</script>

<style lang="less" scoped>
  .map-window {
    width: 200px;
    height: 300px;

    .header {
      display: flex;
      justify-content: flex-end;
      font-size: 25px;

      .el-icon-circle-close {
        color: red;
        cursor: pointer;
      }
    }
  }
</style>

以上是弹窗内部的内容