javascript - Menggunakan peta Baidu dalam vue menggesa bahawa ia tidak boleh dihuraikan

Question

Saya menggunakan vue-cli untuk membina aplikasi dan merujuk skrip Peta Baidu dalam index.html, [&lt;script type="text/javascript" src="http://api.map.baidu.com/api?... Saya ak"&gt;&lt;/script&gt;] Kemudian panggil Baidu dalam fungsi yang dipasang app.vue

怪我咯 · Answer

https://www.talkingcoder.com/... Gunakan pemuatan tak segerak bagi peta

曾经蜡笔没有小新 · Answer

Rujukan global perlu ditambah dalam webpack.base.conf.js

webpackConfig

externals: {
   "BMap": "BMap" 
  },

Ini dimuatkan secara global, jadi ia akan dimuatkan tanpa mengira sama ada anda menggunakannya atau tidak.

Kami bermula dengan pendekatan global, dan kemudiannya menggunakan pemuatan tak segerak mempertimbangkan pengalaman pengguna.

Anda boleh menggunakan kaedah penulisan di atas, kerana nodejs tidak canggih, jadi saya menggunakan kaedah panggil balik

 "http://api.map.baidu.com/api?v=2.0&ak="+ak+"&callback=init";

Anda dapat melihat bahawa terdapat panggilan balik di hujung pautan Baidu js, yang akan memanggil fungsi di bawah tetingkap Kemudian kami boleh mendaftarkan fungsi dan memulakannya secara terus

mounted(){
    window['init']=function(){
    //百度地图加载完成会调用这里，这里就可以正常初始化了
    }
}

Jika anda menggunakan kaedah di atas, hanya satu peta Baidu boleh dimulakan untuk setiap halaman Jika terdapat berbilang peta, ia perlu dikunci.

Apabila memulakan peta pertama, kerana komponen perlu dimuatkan secara tidak segerak, ia dikunci pada masa ini, peta kedua dan ketiga tidak perlu memuatkan komponen secara tidak segerak dan menyimpan nama fungsi dalam kuki atau Storan tempatan dsb. Kemudian apabila peta dimuatkan, fungsi panggil balik berdaftar pertama akan dilaksanakan, dan kemudian yang pertama boleh memulakan peta secara normal. Pada masa yang sama, pemberitahuan membaca dua nama fungsi yang lain daripada storan dan memanggilnya untuk melengkapkan permulaan, supaya halaman yang sama boleh dimulakan beberapa kali pada masa yang sama