Это зарезервированное слово - ошибка в функции, отличной от возврата

Question

Я пытаюсь получить доступ к API и просто сохранять объекты (которые я получаю от него) в состоянии каждый раз, когда я нажимаю на кнопку, но как только я пытаюсь npm запустить это, оно синтаксическая ошибка: это зарезервированное слово. Я не знаю, почему это происходит, и я хочу получить некоторые ответы, и если каким-либо образом вы обнаружите какой-либо недостаток или способ улучшить мой код, не стесняйтесь сообщить мне какЧто ж.Вот код:

import React from 'react';
import ReactDOM from 'react-dom';
import axios from 'axios';

class List extends React.Component {
    constructor(props){
        super(props);
        this.state = {
            personagens: [],
            page: 1,
        };
        this.getNextPers = this.getNextPers.bind(this);
    }

    getNextPers(){
        let URL = 'https://swapi.com/api/people/'+{this.state.page};
        axios.get(URL).then((p) => this.setState({ personages: [...{this.state.personagens}, ...p], page: {this.state.page}+1 }));
    }

    render(){
        return (
            <div>
                <p>Personagens</p>
                {this.state.personagens.map(pers, i) => (
                    <div key={i}>
                        <p>{pers.name}</p>
                    </div>
                )}
                <button onClick={this.getNextPerson}>Proximo Personagem</button>
            </div>
        );
    }
}

ReactDOM.render(<List />, document.getElementById('root'));

Answer 1

В let URL = 'https://swapi.com/api/people/'+{this.state.page}; проблема заключается в фигурных скобках.Попробуйте:

const URL = 'https://swapi.com/api/people/' + this.state.page

или

const URL = `https://swapi.com/api/people/${this.state.page}`

(обе работы)

Я согласен с другими, чтострочные буквы url могут быть лучшим выбором для имени переменной.

Answer 2

URL - неправильный выбор имени переменной, и, скорее всего, это зарезервированное слово, указанное в указанной вами ошибке.Возможно, выберите что-то более похожее на peopleApiEndpoint.

Общая обратная связь:

• Используйте const вместо let при объявлении вышеупомянутой переменной.Вы никогда не переназначаете эту переменную. Прочтите это как дополнительный справочный материал.
• Не используйте индекс как key при переборе элементов.pers.name возможно, будет лучшим выбором ключа. Прочитайте это как дополнительный справочный материал.