Разработка UI Kit (Vue 3 + Composition API) #6. Компонент Input + Vuelidate

Поделиться
HTML-код
  • Опубликовано: 4 ноя 2024

Комментарии • 38

  • @tonykeepfrozen
    @tonykeepfrozen 4 месяца назад

    Не знаю сколько раз я уже говорил Вам спасибо) На Вас буквально держится все мое обучение) За этот урок хочется сказать особенное спасибо, единственный материал, который доступно и без воды объясняет работу с валидацией! Огромное, огрооомное спасибо!)

  • @evgeniiak7458
    @evgeniiak7458 4 месяца назад +1

    Шикарный урок! Очень помог. Спасибо большое!

  • @igorkulibaba7287
    @igorkulibaba7287 Год назад +8

    Огромное спасибо за такие объёмные и подробные уроки💪💪💪

    • @frontend-skills
      @frontend-skills  Год назад +1

      Спасибо, что смотрите ❤️

  • @siablo009
    @siablo009 5 месяцев назад +1

    Золотой человек, только благодаря тебе я начал понимать документацию)

    • @frontend-skills
      @frontend-skills  5 месяцев назад

      Неожиданно и приятно))))

  • @badenglishcooljs8233
    @badenglishcooljs8233 2 года назад +5

    Супер, спасибо, пошел свои инпуты провалидирую как человек!

  • @nailabdullin7096
    @nailabdullin7096 Год назад +4

    Очень полезный кейс, спасибо))

  • @c_i_k_a_d_a5009
    @c_i_k_a_d_a5009 Год назад

    Дружище, годные видосы!

  • @victorplugarev1938
    @victorplugarev1938 6 месяцев назад

    Спасибо! То что надо!👍

  • @dimalukashenko4865
    @dimalukashenko4865 Год назад +4

    отличный урок, спасибо за труд!

  • @YarkiiYa
    @YarkiiYa 2 года назад +3

    Отлично) Спасибо за урок!

  • @orcsamuro9687
    @orcsamuro9687 Год назад +1

    Спасибо, было полезно

  • @dmitryskatov8216
    @dmitryskatov8216 2 года назад +2

    Спасибо большое за урок!

    • @frontend-skills
      @frontend-skills  2 года назад

      🔥🔥🔥

    • @dmitryskatov8216
      @dmitryskatov8216 2 года назад +1

      @@frontend-skills нужен календарь =)))

    • @frontend-skills
      @frontend-skills  2 года назад

      Компонент календаря?)

    • @dmitryskatov8216
      @dmitryskatov8216 2 года назад

      @@frontend-skills ну да , как во всех крутых UI библиотеках)

    • @frontend-skills
      @frontend-skills  2 года назад

      Ну самостоятельно вряд-ли будем разрабатывать. Только если компонент вставлять, но надо подумать)

  • @ЕвгенийСмоляков-ю7з
    @ЕвгенийСмоляков-ю7з 2 года назад +5

    Спасибо за годный контент, очень грамотно и предельно понятно. Есть в планах кастомный селект запилить?

    • @frontend-skills
      @frontend-skills  2 года назад +3

      Да, в планах есть) причём, думаю, именно свой запилим, без библиотек. Так полезней будет)

    • @ДмитрийМеньшиков-ю5с
      @ДмитрийМеньшиков-ю5с 2 года назад +1

      @@frontend-skills Супер, будем ждать, нового видео. И ещё, Александр небольшая просьба, увеличивать масштаб кода, лучше видно , особенно в мобильной версии

    • @frontend-skills
      @frontend-skills  2 года назад

      Принято) спасибо за фидбэк)

    • @sergey5806
      @sergey5806 Год назад +1

      @@frontend-skills а я уже запилил ))
      но с его пере использованием проблемы как и с инпутом :(
      Я коммент отдельно оставил по этому делу

  • @xman5911
    @xman5911 Год назад

    В валидацию имени, стоит добавить проверку, только буквы. И чтобы валидация срабатывала на потерю фокуса.

  • @kalyszhek5296
    @kalyszhek5296 Год назад +2

    Очень внятно обясняет. 🙃👍👍👍
    А как передать img, как props внутри передаваемым компонентом?

    • @kalyszhek5296
      @kalyszhek5296 Год назад +3

      А нашел, оказывается так:
      но почему-то с первого раза не работала, пришлось перезапустить..

  • @web3388
    @web3388 Год назад +1

    Если в приложении много форм, то для каждой придется прописывать настройки валидации и тексты ошибок каждый раз заново, не совсем удобно получается, возможно нужен какой то composable возвращающий rules с настройками по дефолту и возможностью их перенастраивать и добавлять новые для каких то уникальных полей

    • @frontend-skills
      @frontend-skills  Год назад +1

      Все верно, согласен) Любой компонент можно по итогу кастомизировать дальше и дальше под свои требования :) моя задача показать, что это не так страшно, как может казаться :)

  • @sergey5806
    @sergey5806 Год назад +2

    Привет, подскажи плз, сделал компоненты как ты показывал но были проблемы с передачей параметров, пришлось сделать отдельные input и делать передачу через ref() и vuex
    Как можно сделать разные инпуты через component (как у тебя в примере) которые будут взаимодействуют друг с другом и передавать их данные в стор (Если я правильно построил вопрос :))
    И насколько актуальный такой подход, работаю с человеком который не 1 год работает с Vue, он не хотел заморачиваться с компонентами, но я не могу понять его уровень знаний.
    Сейчас говорят что вернулся назад синтаксис export default { data => () ({}) }. Но мне оч понравился твой подход. Как лучше делать или как актуально делать?
    Моя цель научится делать грамотно и красиво, пере использовать код а не писать постоянно одно и тоже, что бы глаза не вытекали от написанного :)
    Спасибо тебе за уроки, очень круто делаешь! Ждем еще уроки...

    • @frontend-skills
      @frontend-skills  Год назад +1

      Привет) самый главный вопрос (точнее 2). Работаешь с Vue2? И действительно тебе нужен стор? Без него не обойтись? Может можно немного пересмотреть архитектуру приложения? Стор нужен если ты одни и те же данные используешь в нескольких местах

  • @orthodox-chanel
    @orthodox-chanel 8 месяцев назад

    Есть какая то валидация от sql и js инъекций?

  • @dimitryselin4225
    @dimitryselin4225 Год назад

    Спасибо за материал! У меня один вопрос, как сделать так, чтобы сообщение о невалидном вводе появлялось после потери фокуса на элементе? тк, когда она появляется сразу - немного сбивает пользователя

  • @victorplugarev1938
    @victorplugarev1938 6 месяцев назад

    Спасибо. Очень интересный и полезный урок. При установке валидтора первой команды достаточно, там уже включена установка валидаторов npm install @vuelidate/core @vuelidate/validators

  • @YulVilaya
    @YulVilaya Год назад

    подскажите пожалуйста, вы сначала сделали установку npm install @vuelidate/core @vuelidate/validators, затем делате - npm i @vuelidate/validators, разве мы в первой установке не установили уже валидаторс? почему второй раз нужно устанавливать ? спасибо!