И почему я создал формы apicase и vuelidate
Внимание: в этом сообщении слишком много слов, и вы можете с ними не согласиться. Если есть что сказать, оставляйте, пожалуйста, комментарии.
Прежде чем я начну
Я большой поклонник Vue.js за его декларативность. Вот почему я не люблю React или Angular, которые заставляют писать намного больше кода, чем необходимо.
Но есть еще две большие проблемы, которые при отсутствии хорошей организации кода (или работы в команде без общего согласия) могут сделать ваш веб-интерфейс действительно уродливым и жирным. Это проблемы
- Заявление и проверка форм
- Объявление и обработка API
Почему я думаю, что это проблематично
Потому что вам нужно объявить форму, правила проверки, отправить метод с большим количеством проверок + обработать результаты вызовов API, показать предварительный загрузчик во время отправки формы, выделить недопустимые входные данные…. ОСТАНАВЛИВАТЬСЯ! Я действительно устал от этой рутины и хочу представить способ минимизировать шаблонный код.
Заявление и проверка форм
Так. Уже существует множество способов упростить обработку форм. Самые известные из них
- Vee-validate. Но я не рекомендую это из-за идеи. Я думаю, что проверка формы не должна зависеть от шаблона
- Vuelidate. Это действительно хорошая вещь, и мне это нравится. Используйте vuelidate и будьте счастливы: *
Но у vuelidate есть одна проблема. Вы должны объявить правила формы и проверки отдельно, и похоже, что вы напишете почти один и тот же код дважды.
И я сделал плагин vuelidate-forms, который позволяет вам использовать одну схему для объявления данных и проверок. Простой пример
И два маленьких метода
Думаю, это нормально. Больше здесь ничего придумать нельзя (Если только не дойти до безумия и не создать чего-то непонятного)
Объявление и обработка API
Существует множество библиотек, подобных axios, для выполнения запросов, но знаете ли вы какую-нибудь известную библиотеку для объявления служб и управления ими? Я не знал. Но я это написал. Рад представить Apicase.
Я создал пример использования своей библиотеки. Он большой, но здесь я постарался показать почти все его возможности
И, конечно же, я создал миксин для Vue.js, который позволяет вам делать что-то вроде:
И последний штрих
Я создал плагин vuelidate-apicase-connect, который обладает универсальными функциями! И еще два :)
Здесь нет объявлений data и methods, но все работает, и выглядит потрясающе!
Библиотеки, которые я создаю / использую
- Apicase - библиотека, которую я сделал для создания красивых API-сервисов.
- Vue-Apicase - порт Apicase на Vue.js
- Vuelidate - действительно лучшая библиотека проверки форм для Vue.js
- Vuelidate-forms - используйте одну схему для объявления данных и валидаций.
- Vuelidate-Apicase-connect - универсальная библиотека
Наконец-то
Я действительно рад сделать интерфейс немного лучше. И буду благодарен за вопросы и звезды.
Следите за мной на github, чтобы видеть обновления: нажмите
Мой твиттер с мемами и анонсами: кликнуть
