Introduce Tencent Map plug-in into mpvue, no error reported and no map displayed.

introduce Tencent Map plug-in into mpvue, no error reported and no map displayed.

app.json is at the same level as pages (written in src/main.js config.

"plugins": {
        "mapPlugin": {
            "version": "1.0.6",
            "provider": "wx5bc2ac602a747594"
        }
    }

main.js of map.vue sibling

import Vue from "vue"
import App from "./index"
const app = new Vue(App)
app.$mount()

export default {
    config: {
        navigationBarTitleText: "",
        usingComponents: {
            "map-route": "plugin://mapPlugin/mapRoute"
        }
    }
};

map.vue

 <!---->
    <map-route :route-info="routeInfo"></map-route>
    
    <script>
//js 
let plugin = requirePlugin("mapPlugin")
export default {
    data () {
        return {
          routeInfo: {}
        }
    },
    mounted(){
        let routeInfo = {
            startLat: 39.90469,    // 
            startLng: 116.40717,    // 
            startName: "",   //  
            endLat: 39.94055,    // 
            endLng :116.43207,  // 
            endName:"",  // 
            mode: "car"  // 
        };
        this.routeInfo = routeInfo;
    },
}
</script>
Oct.22,2021

it would be nice to introduce the component plug-in into the sibling main.json of map.vue (not main.js export default {config: {.

)
{
    "navigationBarTitleText": "",
    "usingComponents": {
        "map-route": "plugin://mapPlugin/mapRoute"
    }
}
  • Mpvue introduces vue-amap to report error

    how to use Amap in mpvue introduced vue-amap error Cannot read property AMap of undefined import VueAMap from vue-amap ; Vue.use(VueAMap); VueAMap.initAMapApiLoader({ key: b8f04aa5ba51b2d24b92fe4e8903e40f , plugin: [ AMap.Autocomplete ...

    Oct.21,2021
  • How to use Tencent Map plug-in in mpvue

    introduce Tencent Map plug-in into mpvue, no error reported and no map displayed. app.json "plugins": { "mapPlugin": { "version": "1.0.6", "provider": "wx5bc2ac602...

    Jun.11,2022
Menu