Javascript 如何将以下代码转换为vue js代码？ navigator.geolocation.getCurrentPosition（成功，错误）； 功能成功（职位）{ 地理编码变量https://maps.googleapis.com/maps/api/geocode/json?latlng='+position.coords.latitude+'%2C'+position.coords.longitude+'&language=en'； $.getJSON（地理编码）.done（函数（位置）{ $（'#country'）.html（location.results[0]。address_components[5]。long_name）； $（'#state'）.html（location.results[0]。address_components[4]。long_name）； $（'#city'）.html（location.results[0]。address_components[2]。long_name）； $（'#address'）.html（location.results[0]。格式化的#address）； $（'#latitude'）.html（position.coords.latitude）； $（'#longitude'）.html（position.coords.longitude）； }) $.ajax({ url:“post/filter/”， 数据：{ 纬度：位置坐标纬度， lon:position.coords.longitude， }, 类型：“POST”， 数据类型：“json”， }); } 函数错误（err）{ console.log（错误） }

这是我的密码。我需要将纬度和经度作为ajax请求传递给服务器端以获取值。。通过使用此代码，我可以做到这一点

我的vue js代码是

     <script type="text/javascript">
    navigator.geolocation.getCurrentPosition(success, error);

    function success(position) {

        var GEOCODING = 'https://maps.googleapis.com/maps/api/geocode/json?latlng=' + position.coords.latitude + '%2C' + position.coords.longitude + '&language=en';

        $.getJSON(GEOCODING).done(function(location) {
            $('#country').html(location.results[0].address_components[5].long_name);
            $('#state').html(location.results[0].address_components[4].long_name);
            $('#city').html(location.results[0].address_components[2].long_name);
            $('#address').html(location.results[0].formatted_address);
            $('#latitude').html(position.coords.latitude);
            $('#longitude').html(position.coords.longitude);
        })
         $.ajax({
          url: 'post/filter/',
          data: {
            lat: position.coords.latitude,
            lon: position.coords.longitude,
          },
          type: "POST",
          dataType: 'json',

        });
    }

    function error(err) {
        console.log(err)
    }

{{vector.name}
分类=新Vue({
el:'分类'，
数据：{
向量：{}，
},
方法：{
搜索类别：功能成功（职位）{
navigator.geolocation.getCurrentPosition（成功，错误）；
地理编码变量https://maps.googleapis.com/maps/api/geocode/json?latlng='+position.coords.latitude+'%2C'+position.coords.longitude+'&language=en'；
$.getJSON（地理编码）.done（函数（位置）{
$（'#country'）.html（location.results[0]。address_components[5]。long_name）；
$（'#state'）.html（location.results[0]。address_components[4]。long_name）；
$（'#city'）.html（location.results[0]。address_components[2]。long_name）；
$（'#address'）.html（location.results[0]。格式化的#address）；
$（'#latitude'）.html（position.coords.latitude）；
$（'#longitude'）.html（position.coords.longitude）；
})
变量过滤器={}；
var self=这个；
过滤器['category']=position.coords.latitude；
过滤器['subcategory']=position.coords.longitude；
$.ajax({
“url”：“发布/筛选”，
数据：过滤器，
数据类型：“JSON”，
类型：“POST”，
成功：职能（e）{
self.vector=e.data；
控制台日志（e）；
},
});
}
}
})

---

但是当我使用vue js代码时，我不能发送ajax请求吗？有人能帮我解决这个问题吗？

针对您的问题，vue处理异步请求的方式如下所示：

<div id="categorie">
  <div>{{vector.name}}</div>
</div>
<script>
categorie = new Vue({
    el: '#categorie',
    data: {
        vector: {},
    },
 methods: { 

            search_category: function success(position) {
              navigator.geolocation.getCurrentPosition(success, error);
            var GEOCODING = 'https://maps.googleapis.com/maps/api/geocode/json?latlng=' + position.coords.latitude + '%2C' + position.coords.longitude + '&language=en';

            $.getJSON(GEOCODING).done(function(location) {
                $('#country').html(location.results[0].address_components[5].long_name);
                $('#state').html(location.results[0].address_components[4].long_name);
                $('#city').html(location.results[0].address_components[2].long_name);
                $('#address').html(location.results[0].formatted_address);
                $('#latitude').html(position.coords.latitude);
                $('#longitude').html(position.coords.longitude);
            })
             var filter = {};
             var self=this;
             filter['category'] = position.coords.latitude;
            filter['subcategory'] = position.coords.longitude;
            $.ajax({
              "url": "post/filter",
               data: filter,
              dataType: "JSON",
              type: "POST",
              success: function(e) {
                  self.vector = e.data;
                console.log(e);
              },

            });
          }
        }

})
</script>

但需要记住的是，上述功能在

vue资源

包中提供。我建议您在@laracasts网站上学习非常好的教程：

现在，我希望您在vue中的异步请求中不会再有任何问题。vue js中代码的转换在JSFIDLE:Happy Coding:）中

category=新的Vue({
el:'类别'，
数据：（）=>({
向量：{}，
地址:{
国家：“，
声明：''，
城市：''，
地址：''
},
}),
方法：{
搜索类别（职位）{
navigator.geolocation.getCurrentPosition（位置=>{
地理编码变量https://maps.googleapis.com/maps/api/geocode/json?latlng='+position.coords.latitude+'%2C'+position.coords.longitude+'&language=en'；
这个.google_响应（地理编码）。然后（响应=>{
this.address.country=response.results[0]。地址\组件[5]。长\名称
this.address.state=response.results[0]。地址\组件[4]。长\名称
this.address.city=response.results[0]。地址\组件[2]。长\名称
this.address.address=response.results[0]。格式化的\u地址
let filter={}
filter.category=response.coords.latitude
filter.subcategory=response.coords.longitude
/****在这里实现你的方法。。。。
这是.http.post（'post/filter'，filter）。然后（response=>{
this.vector=response.data
}).catch（错误=>{
//TODO:在此处处理错误
})
*****/
}).catch（错误=>{
//TODO:在此处处理错误
})
})
},
google_响应（地理编码）{
返回新承诺（（解决、拒绝）=>{
这是.http.get（地理编码）。然后（响应=>{
解析（JSON.parse（response.bodyText））
}).catch（错误=>{
拒绝（错误）
})
})
}
}
})

{{vector.name}


国家：{{address.Country}}

状态：{{address.State}}

城市：{{address.City}}

地址：{{Address.Address}


搜索

您能否澄清“我无法发送ajax请求”的含义？你有错误吗？错误是什么？如何在不搜索的情况下自动检测您希望自动检测什么？

this.$http.get(GEOCODING).then(response=> {
   // here your data is in response 
}).catch(error => {
   // TODO: handle your error here...
})