Javascript-форум (https://javascript.ru/forum/)
-   Оффтопик (https://javascript.ru/forum/offtopic/)
-   -   Vue' thread 1 (https://javascript.ru/forum/offtopic/58273-vue%27-thread-1-a.html)

kobezzza 07.10.2016 18:31

Да, по сути это не дочерние компоненты, а компоненты-свойства, т.е. у нас композиция.

Lemme 07.10.2016 18:49

Это радует, ибо предложенный вариант модального окна в доке, вообще не впечатляет.

Когда одно "модальное окно", тогда еще ладно, но если их несколько, то под каждый объявлять свойство не очень..

kobezzza 07.10.2016 20:02

Если объектов много, то лучше юзать события и Vuex.

Lemme 07.10.2016 20:34

Да я только разбираюсь во всем этом, но vuex юзаю. Но только для тех событий, которые влияют на приложение.

Вот action удаления статьи (пишу простенький блог).

async removeArticle({ commit }, id) {
    commit(REMOVE_ARTICLE_REQUEST);

    try {
      await axios.delete(`/api/articles/${id}`);
      commit(REMOVE_ARTICLE_SUCCESS, id);
    } catch (e) {
      commit(REMOVE_ARTICLE_FAILURE, e.response.data.message);
    }
  }


Но, при нажатии на кнопку выводиться кастомный confirm (их может быть несколько), мне кажется, что данный confirm не должен влиять на приложение. Ну, а смысл "приложению" знать о том, что запущен какой-то диалог, поэтому это состояние локальное.

Я смотрю в сторону событий, но, какой-то слишком запутанный получается "банальный диалог", цель которого запустить callback и скрыть себя.

export default {
  props: {
    onConfirm: Function,
    onCancel: Function,
  },
  data: () => ({ active: false }),
  methods: {
    open() {
      this.active = true;
    },
    close() {
      this.active = false;
    },
    confirmHandler() {
      this.close();

      if (this.onConfirm) {
        this.onConfirm();
      }
    },
    cancelHandler() {
      this.close();

      if (this.onCancel) {
        this.onCancel();
      }
    },
  },
};


Надеюсь после просмотра этого кода, никому плохо не станет ;)

kobezzza 07.10.2016 20:37

Тогда в принципе, всё верно.

Lemme 07.10.2016 20:59

Может у кого-то в закладках пылятся годный материал, никто не хочет поделиться? :)

nerv_ 07.10.2016 22:35

Цитата:

Сообщение от Lemme
ибо предложенный вариант модального окна в доке, вообще не впечатляет

Не впечатляет тем, что слишком простой, а ты намеренно хочешь усложнить?)))
Лучше вместо той колбасы, которую ты колбасишь, внимательнее посмотри на пример. То, что ты написал абсолютно не нужно.

Lemme 07.10.2016 22:54

nerv_, да вроде все видел, возможно я и усложняю, но хочется чистоты в компонентах.

мне бросилось в глаза свойство showModal, которое управляет компонентом modal и не является его частью, хотелось бы его положить внутрь компонента modal. (хотя может это и глупо).

Попробую переварить эту лашпу, может все на самом деле проше.

Lemme 08.10.2016 00:04

nerv_,
Получилось вот такая хрень. Все круто, но не слишком ли много логики выносится из компонента??
И печалька получится, если использовать два диалога. Либо я что-то не понимаю, либо без callback тут не обойтись.

https://jsfiddle.net/s63c8djs/

nerv_ 08.10.2016 18:03

Цитата:

Сообщение от Lemme
Все круто, но не слишком ли много логики выносится из компонента??

Ты про один флаг? Даже не знаю что тебе на это ответить... И как ты собрался управлять видимостью окна без этого флага, тоже не знаю...


Часовой пояс GMT +3, время: 07:00.