2016-10-09 2 views
1
방법 아래

화살표 기능은 브라우저에서 작동하지

var DBBox = React.createClass({ 
    loadArticlesFromServer: function() { 
    $.ajax({ 
    url: this.props.url, 
    dataType: 'json', 
    data: {username:data.username,isPublished:data.isPublished, heading:data.heading}, 
    cache: false, 
    success: function(data) { 
     this.setState({data: data}); 
    }.bind(this), 
    error: function(xhr, status, err) { 
     console.error(this.props.url, status, err.toString()); 
    }.bind(this) 
    }); 
}, 

를 잘 작동하지만 메소드 선언을 변경하면이

loadArticlesFromServer:()=> { //error - Cannot read property 'props' of undefined at line 6 

또는

loadArticlesFromServer=()=> { //Syntax error 

암과 같은 라인 2 기능, 화살표 나는 화살 기능을 잘못 사용했거나 누락 되었습니까? 아니면 지원되지 않습니까? 나는 크롬을 사용하고 행운없이 조화의 깃발을 가능하게하려고 노력했다.

+3

화살표 기능에서 'this'의 동작을 연구해야합니다. 화살표로'bind'를 사용할 수 없습니다. – Redu

+1

[이 질문을 참조하십시오] (http://stackoverflow.com/questions/31647507/this-values-for-arrow-functions) – qxz

+0

감사합니다 @ 리두, 올바른 방향으로 나를 가리켰다. –

답변

0

화살표 함수 표현식은 메소드가 아닌 함수에 가장 적합합니다. 우리가 그들을 방법으로 사용하려고 할 때 어떤 일이 일어나는지 봅시다.

'use strict'; 
var obj = { 
    i: 10, 
    b:() => console.log(this.i, this), 
    c: function() { 
    console.log(this.i, this) 
    } 
} 
obj.b(); // prints undefined, Window 
obj.c(); // prints 10, Object {...} 
관련 문제