Изменить приведение переменных к типу на более правильное решение
Завершена
Проект: Обучение. Март.
| Планируемый запуск: | Дата начала: | Планируемое завершение: | Дата завершения: | 24.11.2021 |
Описание задачи
В miniwar уткнулся в неправильное решение с приведением переменной к типу, причем дважды. Не нашел ,как решить по другому.
Дима, просьба: если есть ошибки, выливай с --no-verify их. А то я запустил проверку типов, а ошибок нигде нет. Пришлось в коммитах искать и у сбея по файлам. Конечно, это не сложно, но все-таки по ошибкам проще.
А проблема у тебя простая: тут какой тип?
export interface NextSeoProps {
title?: string;
string | undefined
А ты что передаешь?
const title: string | string[] | undefined
Массив строк здесь явно лишний. Да, в УРЛ GET-параметры могут быть не только просто строки, но и массивы. Вот если ты в титл хочешь передать, то тебе надо исключить массивы, или привести их к строке.
Первый вариант:
const title = router.query.title && typeof router.query.title === "string" ? router.query.title : undefined;
Здесь если есть значение и тип этого значения - строка, то ее и получаем. В противном случае undefined. То есть чтобы тут ни пришло кроме строки, оно будет заменено на undefined. Тайпскрипт такие конструкции понимает и здесь ему четко ясно: title - это строка или undefined.
Обрати внимание на то, что здесь условие двойное. Первое - это проверка на значение. То есть если на вход придет пустая строка, она не будет соответствовать этому значению и в итоге будет undefined. Но ежели ты хочешь получать в том числе и пустую строку (что зависит от логики), то следует делать так:
const title = typeof router.query.title === "string" ? router.query.title : undefined;
Здесь title может получить в том числе пустую строку.
Второй вариант:
const title =
typeof router.query.title === 'string'
? router.query.title
: Array.isArray(router.query.title)
? router.query.title.join(', ')
: undefined
Здесь, помимо предыдущей проверки, добавляется проверка на массив. Если значение - массив, то мы возвращаем его элементы, объединив запятой, используя метод Array.prototype.join().
Собственно, решение второй ошибки точно такое же.
Пожалуйста!
Наткнулся тут еще на один вариант решения:)
const title = new URLSearchParams(router.query).get('title');
Метод .get() возвращает string | null
Спасибо! Изучаю!!