Вводный курс
10 модулей
5 недели

Filepicker

Скопировать

Компонент Filepicker в веб-приложениях


В новом модуле мы продолжим изучать возможности бизнес-процессов. Разберем ситуации, более сложные, чем простые математические действия. Изучим операции сравнения, ветвления и работу циклов. А также разберемся, как работать с файлами и анализировать их содержимое.

Для этого представим, что нашей задачей является разработка собственной социальной сети. Конечно, не всей сразу, начнем с оформления профиля пользователя.

Общий дизайн

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


Представим, что пользователь может добавить в свой профиль аватар, указать логин, а также заполнить данные о биографии. Но есть одно условие - их нельзя вводить напрямую (у всех полей ввода параметр Disabled = true), они должны быть загружены из файлов.

Filepicker

Для работы с файлами в AppMaster может использоваться блок Filepicker. Он отлично подходит в большинстве ситуаций, позволяет указать различные настройки, выбрать внешний вид. Но сам факт его использования может не подходить тому дизайну, который вы планируете реализовать. Поэтому в нашем примере мы воспользуемся другим способом и создадим возможность загрузки файлов не только без Filepicker’а, но и вообще без каких-то явных кнопок.

Для этого воспользуемся триггером Container onClick в основном контейнере. Любое нажатие на контейнер или его элемент будет запускать данный бизнес-процесс. И начать нам стоит с выбора файлов. Для этого воспользуемся блоком Select Files. Его особенностью является то, что этот блок требует участия пользователя для своего выполнения. Процесс пойдет дальше только после того, как пользователь выберет файлы. Установим параметр Max files = 99 для возможности выбора множества файлов.


По плану пользователь должен одновременно предоставить два файла. Первый - это изображение для установки в качестве аватара. Второй - файл Excel (xlsx) с остальными данными.

Was this article helpful?
Все еще ищете ответ?
Cообщество