Использование Async / Await в ES6 React .JS

Question

У меня есть приложение NetCore2 с установленным ReactJS.

Мое приложение React делает что-то вроде этого ->

• Пользовательский ввод в поле
• axios делаетвызов API для получения пользователя и / или списка пользователей
• В поле ввода отображаются предложения, основанные на том, что было сохранено в состоянии PeopleList.

Я использую интерфейс Office FabricReact - People Picker (в случае, если это имеет значение).

Моя проблема здесь в том, что я понятия не имею, как я могу использовать async / await в моем коде.

Если я добавлю что-то вроде этого

async asynconFilterChanged = (filterText, currentPersonas, limitResults) => {

VS Код выдает ошибку, сообщающую, что асинхронность только для файлов .ts.Также, если я использую await в любых других функциях, я получу ошибку, такую ​​как await is a reserved word.

Насколько я знаю, async / await - это не только TS ... (или я ошибаюсь?).

Я использую старый Babel с предустановкой ENV.

Дайте мне знать, если мне нужно предоставить больше кода, но я хочу, чтобы TLDR запускал функцию фильтра только после моих аксиосЗавершено переводом элементов в состояние PeopleList (массив объектов).

Спасибо!

Answer 1

В соответствии с синтаксисом попробуйте следовать приведенной выше кодовой базе,

asynconFilterChanged = async (filterText, currentPersonas, limitResults) => {
            try {
                await yourFucntion = (limitResults) => {
                ....Your logic...
                }
            } catch(error) {
                console.error(error);
            }

Да, попробуйте использовать и коснитесь async-await guide

Answer 2

При использовании функции со стрелкой вы должны написать async / await следующим образом:

const asynconFilteredChanged = async () => {
 // code here 
}

Проверить Синтаксис для функции асинхронной стрелки