Блог

Я пытаюсь обработать массив ошибок на стороне интерфейса и отобразить их на странице. Я получаю поля, введенные пользователем из серверной части, и пытаюсь отобразить их. Однако внутренние параметры возвращаются в camelcase. Пожалуйста, смотрите ниже:

Я хочу отобразить: поля ввода для электронной почты, любимого вида спорта, оценки среднего балла неприемлемы

Но я вижу

Поля ввода для электронной почты, favoriteSport, GPaScore неприемлемы

Могу ли я каким-либо образом сопоставить имя параметров с пользовательским именем?

Вот мой код:

 Array.isArray(errors) ? `The input fields for ${errors.map(item => item.param)} are unacceptable`
 

Как-нибудь я мог бы сопоставить имена параметров по своему вкусу?

 const mapper = (item) => {
  return {
   gpaScore: 'GPA Score',
   favoriteSport: 'Favorite Sport',
  }[item.param] || 'Unknown property'
} 

return `The input fields for ${errors.map(item => mapper(item)).join(', ')} are unacceptable`
 

Здесь вы могли бы использовать что-то вроде react-intl для форматирования сообщений, но в целом вам понадобится что-то, что превращает программные ключи в удобные для пользователя сообщения

 const t = {
  email: "email",
  favoriteSport: "favourite sport",
  gpaScore: "GPA score"
}

const fields = errors.map(({ param }) => t[param] ?? param)

const message = `The input fields for ${fields.join(", ")} are unacceptable`