laravel Vue js在获取请求时“无法读取未定义的属性'get'”
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/35840862/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Vue js "Cannot read property 'get' of undefined" on get request
提问by Kenziiee Flavius
This error comes up in the log of both post and get requests. I am using laravel 5 and have pulled in vuejs and vue-resource in that order at the bottom of the page. But for some reason making any requests using this.$http.get
or this.$http.post
returns the error in the title.
这个错误出现在 post 和 get 请求的日志中。我正在使用 laravel 5 并在页面底部按顺序拉入 vuejs 和 vue-resource。但出于某种原因,使用this.$http.get
或this.$http.post
返回标题中的错误进行任何请求。
scripts
脚本
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/1.0.10/vue.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue-resource/0.7.0/vue-resource.min.js"></script>
<script src="js/jquery.easing.min.js"></script>
<script src="js/scrolling-nav.js"></script>
<script src="js/app.js"></script>
Js/app.js Code
js/app.js 代码
new Vue({
el: '#application',
data: {
},
ready: function(){
this.openModal();
},
methods: {
openModal: function(){
$('td').on('click', function(){
if($(this).hasClass('not-month'))
{
}
else
{
var year = '2016';
var month = $(this).parent().parent().parent().parent().find('h4').text();
var day = $(this).text();
console.log(day + ' ' + month + ' ' + year);
this.$http.get('/test', function(response){
this.$set('test', response);
});
}
});
}
}
});
回答by Hammerbot
you are trying to use the this
into a jQuery callback. You need to reference it before and use the reference like so:
您正在尝试使用this
jQuery 回调。您需要先引用它并像这样使用引用:
openModal: function(){
var instance = this;
$('td').on('click', function(){
if($(this).hasClass('not-month'))
{
}
else
{
var year = '2016';
var month = $(this).parent().parent().parent().parent().find('h4').text();
var day = $(this).text();
console.log(day + ' ' + month + ' ' + year);
instance.$http.get('/test', function(response){
instance.$set('test', response);
});
}
});
}
回答by Nitesh Yadav
in your component export default just paste following code.
在您的组件导出默认值中,只需粘贴以下代码。
import _Vue from 'vue';
import _VueResource from 'vue-resource';
// vue use vueResource for http request.
_Vue.use(_VueResource);
export default {
name : 'SearchField',
_this: this,
data() {
return {
contactNumber: []
}
},
methods: {
GetContact: function () {
// GET /someUrl
return this.$http.get('localhost:8081').then(response => {
// get body data
let someData = response.body;
alert(someData);
}, response => {
// error callback
alert("error")
}).bind(_this);
}
}
};