地图

src/demo/map.vue

@@ -4,7 +4,7 @@
         <nut-demoheader 
         :name="$route.name"
         ></nut-demoheader>
-
+        <nut-map class="map-box"></nut-map>
         <!-- DEMO区域 -->
     </div>
 </template>
@@ -21,4 +21,8 @@ export default {
 </script>
 
 <style lang="scss">
+.map-box{
+    width: 100%;
+    height: 200px;
+}
 </style>

src/package/lazycomponent/src/lazycomponent.vue

@@ -200,9 +200,7 @@ export default {
     },}
 </script>
 <style lang="scss" scoped>
-.nut-modulelazyloading{
-    position: relative;
-}
+
 .loading-component-init{  
     text-align: center;    
     width: 100%;

src/package/map/src/map.vue

@@ -1,15 +1,45 @@
 <template>
-    <div class="nut-map"></div>
+    <div class="nut-map" id="nutuiMapTencent"></div>
 </template>
 <script>
 export default {
     name:'nut-map',
     props: {
+        key:{
+            type:String,
+            default:"MNFBZ-3F2AJ-655FS-F7GI2-PM5WV-SJBIO"
+        }
     },
     data() {
         return {};
     },
-    methods: {
+    methods: {        
+        getMap() {
+            let that = this;
+            return new Promise(function (resolve, reject) {
+                    window.init = function () {
+                        resolve(qq)//注意这里
+                    }
+                    var script = document.createElement("script");
+                    script.type = "text/javascript";
+                    script.src = "http://map.qq.com/api/js?v=2.exp&callback=init&key="+that.key;
+                    script.onerror = reject;
+                    document.head.appendChild(script);
+            })
+        },
+        init(tt){
+            console.log(tt);
+            let elm = document.querySelector('#nutuiMapTencent');
+            let map  = new tt.maps.Map(elm)
+        }
+    },
+    mounted(){
+        let that = this;
+        this.getMap().then(
+            tt=>{
+                that.init(tt);
+            }
+        );
     }
 }
 </script>