javascript - TypeError: لا يمكن قراءة خاصية 'setState' غير محددة




jquery ajax (2)

أحاول setState مكون بعد رد اتصال ajax يتلقى بيانات من REST api. إليكم الكود الخاص ببناء المكون

constructor(props) {
    super(props);
    this.state = { posts: [] };
    this.getPosts = this.getPosts.bind(this);
}

ثم لدي طريقة componentDidMount التي تبدو كالتالي.

componentDidMount() {
        this.getPosts();
}

الآن إليكم وظيفة getPosts حيث أقوم بطلب أياكس.

getPosts = () =>  {
    $.ajax({
        type: 'get',
        url: urlname,
        success: function(data) {
            this.setState( { posts: data } )
        }
    });
}

أنا أقوم بتعيين الدولة لكنني أتلقى الخطأ التالي.

this.setState is not a function

لست متأكدا حقا ما يسبب هذا. سيكون من المفيد حقًا أن يوجهني أحدهم إلى الاتجاه الصحيح. شكرا لك مقدما.


تتعلق المشكلة بفقدان سياق this . الرجاء تجربة هذا:

let self = this;
getPosts = () =>  {
    $.ajax({
        type: 'get',
        url: urlname,
        success: function(data) {
            self.setState( { posts: data } )
        }
    });
}

أو يمكنك استخدام الربط:

getPosts = () =>  {
        $.ajax({
            type: 'get',
            url: urlname,
            success: function(data) {
                self.setState( { posts: data } )
            }
        });
    }.bind(this)

ربط وظيفة رد الاتصال أيضًا بحيث يشير this داخل رد الاتصال إلى سياق مكون التفاعل وليس وظيفة رد الاتصال

getPosts = () =>  {
    $.ajax({
        type: 'get',
        url: urlname,
        success: (data) => {
            this.setState( { posts: data } )
        }
    });
}

أو يمكنك استخدام ربط مثل

getPosts = () =>  {
    $.ajax({
        type: 'get',
        url: urlname,
        success: function(data) {
            this.setState({ posts: data })
        }.bind(this)
    });
}




this