>웹 프론트엔드 >JS 튜토리얼 >vue가 axios를 사용할 때 이 지점은 어디인가요?

vue가 axios를 사용할 때 이 지점은 어디인가요?

php中世界最好的语言
php中世界最好的语言원래의
2018-04-14 10:06:522418검색

이번에는 Vue가 axios를 사용할 때 이 점이 어디인지, Vue를 사용하여 axios를 호출할 때 이에 대한 주의사항은 무엇인지 알려드리겠습니다. 다음은 실제 사례입니다. vue가 axios를 사용할 때 이 지점은 어디입니까

이 글에서는 Vue가 axios를 사용할 때 발생하는 포인팅 문제를 주로 소개합니다. 아래에서는 자세히 설명하지 않겠습니다.

1.솔루션 Axios를 사용하여 vue에서 네트워크 요청을 할 때 이것이 vue를 가리키지 않고 정의되지 않은 것을 발견하게 됩니다. 화살표

함수

"=>"를 사용하여 문제를 해결할 수 있습니다. 다음과 같습니다:

methods: {
 loginAction(formName) {
 this.$axios.post('http://127.0.0.1/u/subLogin', {
  username: this.username,
  password: this.password
 })
  .then(function(response){
  console.log(this); //这里 this = undefined
  })
  .catch((error)=> {
  console.log(error); //箭头函数"=>"使this指向vue
  });
 });
 }
}

2. 이유 ES6의 화살표 함수 "=>"의 내부 this는 어휘 범위이며, 이는 컨텍스트에 의해 결정됩니다(즉, 외부 호출자 vue에 의해 결정됩니다).

3.여담 "=>" 기능을 사용하면 이전 두 가지 쓰기 방식에 작별을 고할 수 있습니다.

bind(this) 익명 함수

bind(this)来改变匿名函数的this指向

hack写法 var _this= this;의 this 지점을 변경합니다. 해킹 작성 방법 var _this= this;:

loginAction(formName) {
 var _this= this;
 this.$axios.post("...")
 .then(function(response){
  console.log(_this); //这里 _this 指向vue
 })
 });
 }

이 기사의 사례를 읽으신 후 방법을 마스터하셨다고 생각합니다. 더 흥미로운 정보를 보려면 PHP 중국어의 다른 관련 기사를 주목하세요. 웹사이트!

추천 자료:

JS를 사용하여 테이블을 Excel로 만들기 위해 json 형식 배열을 다운로드하는 방법

잭슨이 json 문자열을 구문 분석할 때 첫 글자의 대소문자 변환을 수행하는 방법

Angular 확인 기능을 구현하는 단계

위 내용은 vue가 axios를 사용할 때 이 지점은 어디인가요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.