#28 Попап и scoped slots - Vue.js: практика

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

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

  • @404Negative
    @404Negative Год назад +4

    Илья: ивенты наверх, пропсы вниз, функции через пропсы не передаём.
    Слоты: подержите моё пиво

  • @morwen5899
    @morwen5899 3 года назад +11

    Спасибо за ваш труд! На мой взгляд в учебных курсах не хватает именно такой информации, связанной с архитектурой приложения, базовым пониманием работы фреймворков и грамотными практическими занятиями.

  • @serhii3328
    @serhii3328 3 года назад +1

    Это видео просто открыло мне совсем другой вид на слоты! С каждым вашим видео понимаю что я очень много писал плохого кода, в том числе применял vuex как вы и подметили для таких решений. Спасибо!

  • @vladislavstepanov7591
    @vladislavstepanov7591 3 года назад +4

    Еще давно увидел такую же логику во вьютифае.
    Можно сказать вьютифай мне открыл глаза на качественное апи компонентов)

  • @prosto_germania
    @prosto_germania 3 года назад +1

    очень четко разжевано...спасибо вам и вашей команде за вклад в развитие качественного кодинга.

  • @Antonio-fm1sq
    @Antonio-fm1sq 3 года назад +4

    Спасибо! Звук - топ!

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

    Спасибо за труд. Решение было очевидное, ибо реакт подходы все меня никак не покидают :)

  • @russianstan
    @russianstan 3 года назад +3

    Отлично! Спасибо большое, очень полезное видео

  • @aazubakin
    @aazubakin 3 года назад

    Хороший урок. Резюме можно даже записать, чтобы не забыть.

  • @taran_dm
    @taran_dm 3 года назад

    Спасибо за труд. Было полезно!

  • @stow1x
    @stow1x 3 года назад +1

    Круто, спасибо 🙂

  • @TheHaykokalipsis
    @TheHaykokalipsis 3 года назад +4

    Спасибо большое за уроки. А будут ли продолжения? В частности интересует проект кинотеатр который если всё правильно помню мы должны были кодить с помощью вашего бэкэнда.

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

    Подскажите пожалуйста, почему может быть такое, что я передаю метод в слот, а он undefined, а переменные работают
    Очень нужно помогите

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

    Спасибо!

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

    не реактивные данные обязательно складывать в options, а не в data? Это насчет текста confirmation

  • @MorevOnline
    @MorevOnline 3 года назад

    Звук стал значительно приятнее в сравнении с прошлыми видео. Апдейт оборудования? Что используешь для записи?

  • @MrNightingale1989
    @MrNightingale1989 3 года назад +1

    Спасибо за видео!
    Если используешь key modifiers (а-ля :keyup.esc="close") вместо добавления листенера, то под капотом у вью это всё тот же эвент листенер, только не нужно удалять его перед дестроем компонента? Кажется, что так проще писать, но может есть какие-то нюансы :)

    • @JavaScriptNinja
      @JavaScriptNinja  3 года назад +1

      Да, но здесь мы не можем этого делать - мы ж на document вешаемся

    • @ИванИванов-ц5ю6х
      @ИванИванов-ц5ю6х 3 года назад

      @@JavaScriptNinja а компонент и не должен трогать document, разве нет?

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

    Такой вопрос, а где разбор домашних заданий по криптономикону?)))))

  • @mrVandecko
    @mrVandecko 3 года назад +1

    1.Чому одразу не повісити stop - @click.stop="close()" ?
    2.Чому подію не задати через модифікатор - @keydown.esc="this.close()" ?

  • @tylerdurden3869
    @tylerdurden3869 3 года назад +1

    Можно ли в Slots Передать компонент с кнопками?
    Если да, то как поймать события ?

  • @alexs7931
    @alexs7931 3 года назад +1

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

  • @ВладиславЛозинский-н6р

    Вопрос по поводу передачи функции. Как будет правильнее..
    Таким же способом, можно передать ф-цию в дочерний компонент, допустим дано:
    В родительском компоненте массив c объектами - toDoList - и функция - deleteItem, которая, допустим, принимает ID эл-та и удаляет один итем из массива toDolist. Есть дочерний компонент toDoItem и внутри кнопка УДАЛИТЬ. Допустим, нам нужно удалить эл-т. Отсюда вопрос, какой подход будет правильнее -- по нажатию на кнопку 'удалить' в дочернем компоненте, вызывать emit, а после в родительском подписываться на событие и уже запускать функцию deleteItem ИЛИ же передать функцию deleteItem в дочерний и по клику на кнопку 'удалить' вызывать напрямую эту самую функцию?

  • @АртемЛамзов
    @АртемЛамзов Год назад +1

    Не понимаю, чуть ли не в каждом видео автор говорит о том что во вью используется компонентный подход и не следует передавать компонентам функции(методы) через пропсы, используйте события (эмиты) и ловите их, а тут так легко эту концепцию игнорирует.
    Без негатива, видео очень полезные и тд, но ни у кого не возникает вопросов о корректности данного подхода и его противоречивости относительно общей концепции?
    P.s сам пишу на реакте и ничего против передачи функций через пропсы не имею)

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

    ошибка: this.close() is not a function

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

    захотелось поотбивать себе руки за то, что использовал в такой ситуации refs

  • @maksymgapachilo9507
    @maksymgapachilo9507 3 года назад

    Ну если кнопка будет межами Компонентом Popup, а как мне тогда достать функцию с Popup?) Например был такой случай, что когда нажимаю на кнопку редагувать(кнопка в родителя) то метод должен выполниться в компоненти ребенка, метод такой там( записывает даные в v-model компонента ребенка)

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

    Спасибо за видео. Но есть один вопрос, кто может помочь?
    на 08:30 в mounted мы имеем такую прослушку :
    document.addEventListener("keydown", (e) => {
    if (this.isOpen && e.key === "Escape") {
    this.close();
    }
    });
    но почему если сделать так, то не срабатывает:
    document.addEventListener("keydown", function (e) {
    if (this.isOpen && e.key === "Escape") {
    this.close();
    }
    });
    Как я понимаю, что всему виной this.
    Подскажите, если не сложно. Ну, или скиньте ссылку, чтобы я смог почитать. Заранее благодарен!

    • @ВладДунаев-э2ъ
      @ВладДунаев-э2ъ 2 года назад +2

      Есть разные типы функций, если в кратце то: функция с словом function () { // } создаёт свой контекст, т.е. свой this. Стрелочная же ссылается на контекст родителя, т.е. компонента. Почитай про контекст в общем, в случае с ключевым словом function нам пришлось бы делать байнд контекста

    • @404Negative
      @404Negative Год назад +1

      @@ВладДунаев-э2ъ причем тут контекст... нет ссылки на лямбду вот поэтому и не получится удалить