Question

我想要客户端当前的地理位置，为了准确，我把10000超时

 var options = {
      timeout: 10000
    };

这是js函数

function getCoordinates() {
  return new Promise(function(resolve, reject) {
    if (
      !("geolocation" in navigator) ||
      !("getCurrentPosition" in navigator.geolocation)
    ) {
      return Promise.reject(new Error("geolocation API not available"));
    }
    var options = {
      timeout: 10000
    };

    // browser prompts for permission
    navigator.geolocation.getCurrentPosition(
      getPositionCallBack,
      reject,
      options
    );

    function getPositionCallBack(position) {
      var coords = "";
      try {
        coords = {
          lat: position.coords.latitude,
          long: position.coords.longitude
        };
      } catch (err) {
        return reject(err);
      }
      return resolve(coords);
    }
  });
}

商店：

var Ui = new WebUi({
coordincates:'',//initialise
});

export default {
  name: "app",
  store: Ui.store,
  components: { Page },
  data() {
    return {
      favIcon: getFavIcon()
    };
  }
};

在Promise完成后更新WebUi坐标。

我在获取坐标后再次更新存储，然后在vue js中获得跟随错误。

Do not mutate vuex store state outside mutation handlers.

我修改了store / index.js 更新

strict: false,

现在的问题是如何从javascript更新我的商店坐标。

Answer 1

如果您将scrict设置为false，您就可以通过以下任何组件改变商店的状态：

// use this code inside a component (only throws no warning if strict: false)
this.$store.state.coordinates = {x: 1, y: 2};

请注意，该名称为coordinates，在您的示例中，您的商店为coordincates，我认为这是一个错字。

如果商店中不存在coordinates，请使用：

// use this code inside a component (only throws no warning if strict: false)
// Use Vue.set() when the property may not exist inside the store yet
Vue.set(this.$store.state, 'coordinates', {x: 1, y: 2});

话虽如此，最好的是将strict留给true并创建mutations。由于您使用的是WebUi，因此可能有特定的方法来执行此操作。

在vue js中获得Geo Cordinate

1 个答案: