如何在Vue JS中修复Google地图中心位置

时间:2018-12-13 13:31:03

标签: javascript google-maps vue.js

hi创建房地产应用程序,如果我从Json调用位置,我在Google地图中就会遇到问题,我会出错 我的html代码

string redirectUri = "https://login.live.com/oauth20_desktop.srf";
string resourceUri = "https://analysis.windows.net/powerbi/api";
string authorityUri = "https://login.windows.net/common/oauth2/authorize";
string clientId = "xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx";
string powerBIApiUrl = $"https://api.powerbi.com/v1.0/myorg/datasets/xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx/refreshes";

AuthenticationContext authContext = new AuthenticationContext(authorityUri, new TokenCache());
var authenticationResult = await authContext.AcquireTokenAsync(resourceUri, clientId, new Uri(redirectUri), new PlatformParameters(PromptBehavior.Auto));
var accessToken = authenticationResult.AccessToken;

var request = WebRequest.Create(powerBIApiUrl) as HttpWebRequest;
request.KeepAlive = true;
request.Method = "POST";
request.ContentLength = 0;
request.Headers.Add("Authorization", String.Format("Bearer {0}", accessToken));
using (Stream writer = request.GetRequestStream())
{
    var response = (HttpWebResponse)request.GetResponse();
}
name: "Property",
  data() {
    return {
      ref: this.$route.params.ref,
      propertydata: {},
      center: { lat: 45.508, lng: -73.587 },
      markers: [],
      places: [],
      currentPlace: null
    };
  },

  created() {
    this.$http
      .get("http://localhost:3000/Listing/" + this.ref)
      .then(function(data) {
        console.log(data);

        this.propertydata = data.body;
        this.center=data.body.latitude;
        this.center=data.body.longitude;
        th
      });

 <gmap-map :center="{lat: {{propertydata.latitude}} , lng: {{propertydata.longitude}} } " :zoom="14" style="width:500px;  height:500px;"></gmap-map>

原始表达式::center =“ {lat:{{propertydata.latitude}},lng:{{propertydata.longitude}}}”

我从json获取的位置详细信息,我不知道如何解决

1 个答案:

答案 0 :(得分:0)

声明组件的正确方法是: <gmap-map :center="{lat: propertydata.latitude, lng: propertydata.longitude}" :zoom="14" style="width:500px; height:500px;"></gmap-map>

您应仅在标签内部使用{{...}}语法,而不在标签属性中使用