Zmiana wpisu z poziomu okna modalnego

0

Hej,

  1. mam komponent ( rodzic ), w którym wyświetlam np. listę userów.
  2. dodałem modal (child) z wymaganym propsem
  props: {
    user: { type: Object as PropType<IAccountResponse>, required: true },
  },
  1. na klik w edit button na rodzicu pobieram sobie całego usera i przekazuję do childa

pyt.

  1. czy props w child powinienem przekopiować do jakiegoś obiektu i to ten obiekt użyć w formularzu na modalu?
const user = ref<IAccountResponse>(props.user);
  1. czy po edycji wyEMITotować ten obiekt do parenta i tam zapuścić request updejtujący?

czy jak poprawne wykonać edycję wpisu używając modala właśnie

0

Propsów nie można edytować bezpośrednio. Rozwiązań masz tu dużo w zależności jak robisz to w pozostałej części aplikacji.

Jeżeli ma być edytowalny to powinien być to v-model (np. z opcjonalną nazwą) i po edycji emit. Jeżeli robisz to w wielu miejscach to możesz ten boilerplate zastąpić przez composable vueuse/usevmodel. Dzięki temu działa to tak jakbyś edytował bezpośrednio propsa, ale z zachowaniem data flow wymaganym przez vue.

Możesz też zastosować provide / inject, prościej.

Możesz i po store Vuexa sięgnąć jeżeli masz skłonności masochistyczne.

To wszystko zakładając że update request robisz w parent. Ale to czy request update zrobisz w parent czy tym child modalu to twój wybór.

Jeżeli jednak w child, to nie mutuj propsa tylko przekopiuj dane do ref/reactive.

Zarejestruj się i dołącz do największej społeczności programistów w Polsce.

Otrzymaj wsparcie, dziel się wiedzą i rozwijaj swoje umiejętności z najlepszymi.