Comments 16
tldr: к js функции можно допихть произвольных свойств. Но идея в контексте компонентов мне понравилась, попробуем.
/** Обратите внимание на импорт, мы залезли во внутренности EventCard и выдернули необходимое. Выглядит это посредственно */
import { ActionBar } from "./shared/components/EventCard/ActionBar";
import { StatusBar } from "./shared/components/EventCard/StatusBar";
В EventCard/index.tsx можно сделать
export { ActionBar } from "./ActionBar";
export { StatusBar } from "./StatusBar";
И в файле использования уже не так все плохо будет
import { EventCard, ActionBar, StatusBar } from "./shared/components/EventCard";
Именно. В свое время отказался от красивого синтаксиса dot нотаций, когда одна из подобных фич грузила дополнительную библиотеку. Например, в такой карточке (а она может быть одна на всю страницу) нужно отобразить график.
А здесь начинает ломаться tree-shaking. И даже если мы будем использовать такой компонент без графика (дополнительной библиотекой), она притащится вся и целиком, даже если не используется, получается мертвый код налицо.
Если же вместе с dot-нотацией идет в комплекте babel-плагин, тогда уже лучше.
export { ActionBar } from "./ActionBar";
export { StatusBar } from "./StatusBar";А у вас такие переэкспорты "найти определение компонента" не ломают?
Ну и какая же статья про JSX без кода на view.tree, логику работы которого вы тут почти переизобрели:
Ой, я случайно добавил сюда ещё и локализацию с виртуальным рендерингом, простите.
Ой, я случайно добавил сюда ещё и локализацию с виртуальным рендерингом, простите.
Вы молодец, но всё ваше сообщение не в тему и не к месту. Вам уже говорили, что такой подход к рекламе чего-либо может портить впечатление о продукте?)
Очень даже в тему и к месту. Не стоит благодарить меня за источник вдохновения.
Чел, это нечитабельно и никто этим пользоваться не будет
А как вы определяете читабельность?
Примерно так: последний раз я читал про этот синтаксис 2 года назад или никогда. Понимаю ли я сейчас код написанный другим разработчиком. И когда мне надо прочитать код бакенов на go, я понимаю. А какая иконка и откуда поставится в icon \like я не понимаю. И чем отличается title @ \Like и title \Like. Вопросики, escape и / и <= я не понимаю зачем нужны, но могу сдать вид что их нет.
Всё, перечисленное вами, характеризует не язык, а лично вас - нежелание потратить и 5 минут на освоение нового инструмента.
Зачем вы тратите на них время?
Это хороший подход, позволяющий писать чистый и понятный код в декоративном стиле, жали только что типизация react не позволяет родительский компонент обернуть в memo, ждём и надеемся на решение этого неудобства от команды разработчиков react библиотеки
Организация react-компонентов с помощью dot-notation и почему я часто прибегаю именно к этому способу