Я работал про Ant Design. Но я не могу понять модель кода входа в систему. Здесь они используют
effects: {
*login({ payload }, { call, put }) {}
}
если вы хотите увидеть полный код, перейдите по этой ссылке js-файл модели входа в Ant Design Pro
Здесь вы найдете полный код. Теперь я не понимаю, что означает этот код.
Спасибо
Имя функции со звездочкой означает генератор. Генератор - это function, чей рабочий процесс можно приостановить с помощью ключевого слова yield. yield - это двусторонняя связь между генератор и его вызывающий. Обладая этими знаниями, давайте посмотрим на саму функцию:
*login({ payload }, { call, put }) {
const response = yield call(fakeAccountLogin, payload);
yield put({
type: 'changeLoginStatus',
payload: response,
});
// Login successfully
if (response.status === 'ok') {
reloadAuthorized();
const urlParams = new URL(window.location.href);
const params = getPageQuery();
let { redirect } = params;
if (redirect) {
const redirectUrlParams = new URL(redirect);
if (redirectUrlParams.origin === urlParams.origin) {
redirect = redirect.substr(urlParams.origin.length);
if (redirect.match(/^\/.*#/)) {
redirect = redirect.substr(redirect.indexOf('#') + 1);
}
} else {
window.location.href = redirect;
return;
}
}
yield put(routerRedux.replace(redirect || '/'));
}
},
function ожидает, что в качестве входных данных будут использоваться два объекта, и сводит их к параметрам. Вам необходимо передать первый параметр как объект, например {payload: 'something'}, и атрибут payload этого объекта будет отображен в параметр function. Точно так же второму переданному вами объекту потребуются вызов и атрибут put, которые являются функциями.
Сначала он выполняет вызов, передавая fakeAccountLogin и полезную нагрузку, и возвращает функцию, то есть функция приостанавливается и отправляет результат вызова во внешнюю область. Когда функция входа в систему возобновляется с использованием .next() function итератора генератора, все, что ему передается, будет назначено для ответа. После этого вызывается put, передавая changeLoginStatus как type и response как payload и результат, если он уступается вызывающему этого function.
Когда вызывается .next() итератора этого генератора, response.status проверяется на «ok», и если есть совпадение, вызывается reloadAuthorized, инициализируется urlParams, а также params. После этого redirect будет инициализирован с params.redirect, и это правда, redirectUrlParams будут инициализированы и произойдут некоторые дальнейшие операции с URL. В любом случае, если есть перенаправление, функция завершается.
Если response.status был 'ok', но перенаправления не было, то вызывается put, и результат выдается из function конца, когда будет выполнен следующий .next() вызов, function завершится. Если response.status не был 'ok', то function закончился намного раньше, а именно, когда внешний if был оценен как ложный.
Вам нужно будет взглянуть на сокращение объектов и массивов в Javascript, а также на итераторы и функции генератора. У вас будут трудные времена, пока вы не выделите для этого время, поэтому чем раньше вы это сделаете, тем лучше. Я рекомендую главы 2 и 5 этой книги: https://github.com/getify/You-Dont-Know-JS/tree/master/es6%20%26%20beyond
