К
Собственно, компонент я уже сделал почти, но без шаблона
Size: a a a
2020 November 18
К
Вот и думаю, как бы удобнее шаблоны задавать
PM
хм, ребят, у меня такая ситуация. Есть компонент. Некий эдитор, суть которого - контейнер с кнопками и кое-какой логикой, но без полей ввода, которые думаю передавать в качестве слота, чтобы не плодить кучу однотипных компонентов.
Возникает проблема. Даже две. (Возможно, тривиальных, но пока ещё не настолько много опыта в свелт, чтобы на глаз оценивать разные архитектуры на нём.)
При открытии эдитора мне нужно засунуть в эти поля ввода из эдитора значения.
И второе. По нажатию кнопки в эдиторе мне нужно из полей слота забрать значения и что-то с ними сделать (что именно - решает эдитор).
Короче говоря, мне нужно, чтобы я мог передать в компонент шаблон с разметкой, чтобы при этом компонент сам рулил логикой шаблона. Вариант со слотом видится немного топорным, но что-то другой способ на ум пока не пришёл, отсюда и вопросы выше.
Возникает проблема. Даже две. (Возможно, тривиальных, но пока ещё не настолько много опыта в свелт, чтобы на глаз оценивать разные архитектуры на нём.)
При открытии эдитора мне нужно засунуть в эти поля ввода из эдитора значения.
И второе. По нажатию кнопки в эдиторе мне нужно из полей слота забрать значения и что-то с ними сделать (что именно - решает эдитор).
Короче говоря, мне нужно, чтобы я мог передать в компонент шаблон с разметкой, чтобы при этом компонент сам рулил логикой шаблона. Вариант со слотом видится немного топорным, но что-то другой способ на ум пока не пришёл, отсюда и вопросы выше.
тут 2 варианта решения:
1) полный контроль над вложенными компонентами, с 2way биндингами и тп, тогда вложенные компоненты нужно передавать структурой через пропс
2) более свободный вариант с использованием слота, но тогда придется смириться что слот это черный ящик с однонаправленным потоком данных
1) полный контроль над вложенными компонентами, с 2way биндингами и тп, тогда вложенные компоненты нужно передавать структурой через пропс
2) более свободный вариант с использованием слота, но тогда придется смириться что слот это черный ящик с однонаправленным потоком данных
PM
Тут просто какой момент, эдитор ничего не знает про поля. Ему по нажатию кнопки нужно вытащить объект со значениями инпутов, селектов и т.д. из шаблона.
Суть такая: я делаю механизм редактирования списков. Т.е. есть некий список, т.е. таблица с данными. Можно поднять запись на редактирование, либо добавить новую. Сущности отличаются только набором параметров. Вот я и хочу сделать компонент, в который просто передам шаблон для отображения записи списка и шаблон с набором полей для редактирования. Чтобы не дублировать каждый раз логику.
Суть такая: я делаю механизм редактирования списков. Т.е. есть некий список, т.е. таблица с данными. Можно поднять запись на редактирование, либо добавить новую. Сущности отличаются только набором параметров. Вот я и хочу сделать компонент, в который просто передам шаблон для отображения записи списка и шаблон с набором полей для редактирования. Чтобы не дублировать каждый раз логику.
можно слот + коллбек в контексте, который вызовешь когда поле изменилось
PM
кстати а "кнопка" она в эдиторе или внутри слота?
PM
это которая "вытаскивает объект со значениями"
К
тут 2 варианта решения:
1) полный контроль над вложенными компонентами, с 2way биндингами и тп, тогда вложенные компоненты нужно передавать структурой через пропс
2) более свободный вариант с использованием слота, но тогда придется смириться что слот это черный ящик с однонаправленным потоком данных
1) полный контроль над вложенными компонентами, с 2way биндингами и тп, тогда вложенные компоненты нужно передавать структурой через пропс
2) более свободный вариант с использованием слота, но тогда придется смириться что слот это черный ящик с однонаправленным потоком данных
Структурой через пропс - это как? Свелт же не умеет в такое.
В случае со слотом - как можно данные забирать из слота кроме биндинга?
В случае со слотом - как можно данные забирать из слота кроме биндинга?
К
кстати а "кнопка" она в эдиторе или внутри слота?
В эдиторе
К
можно слот + коллбек в контексте, который вызовешь когда поле изменилось
Да, я просто ищу более изящное решение )
PM
Структурой через пропс - это как? Свелт же не умеет в такое.
В случае со слотом - как можно данные забирать из слота кроме биндинга?
В случае со слотом - как можно данные забирать из слота кроме биндинга?
В смысле не умеет? передаешь ему массив компонентов и выводишь через each + svelte:component
PM
В эдиторе
а эдитор что-то потом делает с этими значениями?
К
В смысле не умеет? передаешь ему массив компонентов и выводишь через each + svelte:component
А, в этом смысле. Ну это не совсем то. Все же шаблон нужен более гибкий.
PM
Структурой через пропс - это как? Свелт же не умеет в такое.
В случае со слотом - как можно данные забирать из слота кроме биндинга?
В случае со слотом - как можно данные забирать из слота кроме биндинга?
из слота никак, только перепрокидыванием через родителя опять, как в примере выше. слот - однонаправленный поток данные от враппера в слот через scoped slots
К
а эдитор что-то потом делает с этими значениями?
С объектом значений, не с самими значениями
PM
А, в этом смысле. Ну это не совсем то. Все же шаблон нужен более гибкий.
тогда только через слот, но в этом случае компонент который устанавливает контент слота и рулит всем. эдитор - только враппер
PM
С объектом значений, не с самими значениями
не важно, кто конечнный потребитель этого?
К
не важно, кто конечнный потребитель этого?
Конечный наверху, он события только получает
PM
Конечный наверху, он события только получает
наверху чего? вот есть компонент, в нем:
// Some.svelte
// Some.svelte
<Editor>
<input>
<input>
</Editor>
PM
объект со значениями получать должен этот компонент, Editor или еще выше?
К
Эдитор делает некую обработку и диспатчит наверх событие с объектом