How to call internal functions externally?

clipboard.png 

methods: {
      move(){

      },
      renderMap() {
        var self = this;
          var map = new AMap.Map("container", {
            zoom: 16,
            scrollWheel: false,
          });
          
        map.panTo([111.672046,40.821607])

        AMapUI.loadUI(["misc/PositionPicker"], function (PositionPicker) {
          if (self.point.length != 0) {
            map.center = self.point;
          }
          var positionPicker = new PositionPicker({
            mode: "dragMap", //Marker
            map: map,//xy
            iconStyle: {
              //
              url: require("../../../assets/images/@3x.png"), //
              size: [22, 32], //
              ancher: [24, 40] //size
            }
          });
          positionPicker.on("success", function (positionResult) {
            var location = {
              address: positionResult.address,
              point: [positionResult.position.lat, positionResult.position.lng]
            };
            self.address = location.address;
            self.point=location.point;
            self.$emit("location", location);
          });
          positionPicker.start();
          map.panBy(0, 1);
          if(self.po.point!==undefined){
            var marker = new AMap.Marker({
              position:[self.po.point[1],self.po.point[0]]
            });
            map.add(marker);//
          }
        });
      }
    }

vue2, wants to call the map.panTo method in renderMap () in the move method.

but I don"t know how to call it. I"ve tried a lot of methods, but I can"t use map.panto if I put it outside renderMap.

uses Amap"s API, but doesn"t know how to call his method outside.
Amap translate api

for a big solution, thank you very much.

Vue.js javascript
May.24,2021

you can expose the method you want to use in the renderMap method, as in the following example 

<script>
export default {
    data(){
        return {
            c: ''
        }
    },
    methods: {
        a(){
            this.c()
        },
        b(){
            function c(){
                console.log('')
            }
            this.c = c
        }
    },
    mounted(){
        this.b()
        this.a()
    }
}
</script>
data(){
    return{
        map:null
    }
},
methods: {
      move(){
          this.map.panTo([111.672046,40.821607])
      },
      renderMap() {
          this.map = new AMap.Map("container", {
            zoom: 16,
            scrollWheel: false,
          });
          
          this.map.panTo([111.672046,40.821607])

          ....
      }
}

after thinking about it, this is not appropriate, because the map change will be re-rendered. Consider the downstairs method and put it directly outside the scope of vm .

, I happen to have done this, which is a matter of scope.
defines the map object in the data
or
puts the definition in the outer layer, and then in the method instance Amap gives the object
clipboard.png
or
hangs the object on the window object. window.map = new AMap.Map ()

use a variable in data to save the method you need to call. Or return this method

nothing that cannot be solved with window.x

Previous: Can Mybatis return a Map collection with attribute values-> attribute values?

Next: Select count (*) is it too long?

css mysql arrays josn react html typescript webpack npm sass R objective-c .net sql-server jquery python-3.x angularjs django angular excel regex iphone ajax linux xml pandas vba spring database wordpress string wpf xcode windows bash postgresql oracle multithreading eclipse list firebase algorithm macos forms image scala visual-studio azure bootstrap spring-boot react-native python-2.7 docker performance function winforms matlab powershell apache dataframe api sqlite numpy rest shell selenium flutter dart maven loops qt swing android-studio csv express file class tensorflow sorting codeigniter perl
© 2021 CodesHelper
Advertising Contact us About us
Menu