Запрос уникального объекта не по id

Выполняется
Планируемый запуск: Дата начала: 28.07.2022Планируемое завершение: Дата завершения:

Описание задачи


Вытаскиваю из url с помощью useRoute порпаметр поста urlname и по нему делаю фильтр среди всех постов. Работает, но явно это гланды через ж...
Как в том случае следкет поступить?
ПроектЗадачаСтатусДата постановкиНачалоКонецКто создал
Обучение. Март.Запрос уникального объекта не по idВыполняется24.11.2021 08:56:3428.07.2022 10:44:0528.07.2022 10:44:07
Обучение. Март.Запрос уникального объекта не по idВыполняется24.11.2021 08:56:3428.07.2022 10:43:5828.07.2022 10:44:00
Ну так а зачем ты тип посту задал массив?
export type PostPageViewProps = { post: PostFragment[] }
Сам виноват.
Еще и здесь передаешь post или массив.
<PostPageView post={post || []} />
Пьяный был или сонный? :)

Это все из первого вопроса выползает))
--> Вытаскиваю из url с помощью useRoute порпаметр поста urlname и по нему делаю фильтр среди всех постов. Работает, но явно это гланды через ж...
Как в том случае следкет поступить?
---
Вот здесь похоже надо было заблуждаться до конца и передавать массив из одного поста....

Да как бы ты ни поступал, вот здесь же ты берешь один пост из массива.
const post = data.data?.posts[0]
То есть здесь у тебя константа post - это один объект, а не массив. Так почему ты дальше пытаешься пробросить как массив? И почему там на конце ты из массива пытаешься получить свойство title, как будто у тебя там не массив должен прийти, а конечный пост? То есть ты настолько запутался тут с типами объектов, просто ппц.


Пойду распутываться))
А, и да. При получении поста из массива есть засада. То есть в тайпскрипт есть бага при получении элементов из массива. Пример:
type A = string[] const array: A = []; const a = array[999];
Как ты видишь, array здесь - пустой массив. Хотя не важно пустой он или полный. Важно другое - в нем нет элемента с индексом 999 (в данном случае вообще ни одного). При этом typescript здесь константе a задаст тип string, а не string | undefined. То есть typescript не понимает, что элемент может и отсутствовать.
К чему я это? Если ты таким образом прокинешь post дальше как есть, TS будет думать, что у тебя этот объект всегда есть, хотя на самом деле его может и не быть.

Николай, если будет время, посмотри, пожалуйста, правильно распутался или не очень: https://github.com/linklib/miniwar/commit/c5d27e078801c8198171cda80e2d40e5fecc8b92
В целом, да. Но это если говорить про вопрос передачи поста во вьюху. Но вот с парсингом контента и дальнейшим его выводом у тебя все очень плохо.

1. JSON.parse() - это очень капризный метод. Если что-то не так, он разваливается с критической ошибкой. То есть у тебя приложение рискует частенько разваливаться. Сам попробуй в консоли, к пример, выполнить такое:
JSON.parse('')
Получишь ошибку. Если у тебя такое приведет к ошибке в реакт-компоненте, то у тебя вся страница развалился. Методы объекта JSON надо оборачивать в try/catch.

2. У тебя content имеет тип any, хотя ты даже сам в случае отсутствия объекта post передаешь по умолчанию в content пустую строку. При этом далее выполняешь content.blocks.map(....). Попробуй-ка выполнить content.blocks.map() на пустой строке.

Резуме: технически твой код может работать (если залетели правильные данные), но он очень ненадежен и обязательно даст сбои, если данные залетят невалидные. У тебя даже эслинт подсказывает "Здесь у тебя any, задай нормальный тип".
Это бардак. Такой бардак допускать нельзя. Прорабатывай типы более четко.
Николай, спасибо! Дорабатываю код.
Николай, привет!
Посмотри, пожалуйста, исправленный вариант: https://github.com/linklib/miniwar/commit/963bea3dbc40ea5e49f813cd441ffffd29e8d342

Не очень понял, почему, но мне вообще оказалось не нужно распарсивать JSON.

И вопрос: здесь все равно поставил :any, так как не нашел иного типа для объекта data: https://github.com/linklib/miniwar/blob/963bea3dbc40ea5e49f813cd441ffffd29e8d342/src/pages/Posts/Post/View/index.tsx#L8
Явно что-то на базовом понтийном уровне не выстроено в башке, вот хочу разобраться...
>> Не очень понял, почему, но мне вообще оказалось не нужно распарсивать JSON.
Это потому что в GraphQL-схеме у тебя задан тип JSON.
{ "name": "content", "description": null, "args": [], "type": { "kind": "SCALAR", "name": "JSON", "ofType": null }, "isDeprecated": false, "deprecationReason": null },
GraphQL-сервер сам на лету обрабатывает JSON-поля. Точнее чистый GraphQL таким не занимается, но apollo-server да.

>> здесь все равно поставил :any, так как не нашел иного типа для объекта data

С any тут все понятно: у тебя для моля задано JSON. Сам же наверняка понимаешь, что по сути там может прийти любая валидная JSON-строка, так что при парсинге никак нельзя быть уверенным, какая конечная структура получится. Тем не менее, прелесть any в том, что ты легко этому можешь задать свой тип заместо any. Пример:


Как видишь, здесь я для data уже описал более четкую структуру, прописав, что это объект, который содержит свойство src, тип которому - строка (правда обязательно ли содержит или нет, это тебе уже виднее, а то может там должен быть тип src?: string | null).
А вот text я не описал, потому вот ошибки появились, надо прописать.

Но это в случае, если у тебя там структура заранее известна и она такая и есть. Ежели ты предполагашь, что там в итоге просто будет объект с произвольными полями, то можешь так описать:
data: Record<string, string>
Тогда будет доступно любое свойство, а его значение будет расценено как строка.

Добавить комментарий