System komentarzy z odpowiedziami

Witam,

w jaki sposób wykonać system komentarzy z odpowiedziami? Samo dodawanie komentarzy już mam, teraz mam problem z odpowiedziami.

W tabeli 'comments' ma id_article dzięki temu wiem którego artykułu dotyczy komentarz. Co do odpowiedzi mam tabelę 'answers_comment' a w niej id_comment. I to nawet działa, wiadomo którego komentarza dotyczy odpowiedź. Główny problem mam z wyświetleniem tego. Komentarze wyświetlane są pętlą, odpowiedzi do komentarza wyświetlane są po kliknięciu przycisku 'pokaż odpowiedzi' i to też nawet działa tylko jeśli komentarzy jest 10 a chcę wyświetlić odpowiedź do pierwszego te zostają wyświetlone pod każdym. Mam nadzieję że rozumiecie o co mi chodzi?

<div class="window-comments" v-for="item in comments">
                      <div class="comment">{{item.comment}}</div>
                      <button @click="showAnswers(item.id)">Po kliknięciu miały by się pokazać odpowiedzi 
                      do komentarza o danym ID ale tylko pod komentarzem o danym ID</button>
                    </div>

Pokaż w jakiej postaci dostajesz te dane.

Najlepiej jakbyś sobie zrobił joina na serverze, i wysłał już sobie zagnieżdżoną strukturę.

        {
            "id": 1,
            "id_user": 1,
            "id_post": 1,
            "comment": "..."
        }

        {
            "id": 1,
            "id_user": 1,
            "id_comment": 1,
            "answer": "..."
        }

dane otrzymuję mniej więcej w takiej postaci.
Możesz mi powiedzieć coś więcej o zagieżdżaniu struktur w php? albo jakiś artykuł na ten temat bo nie mogę znaleźć nic konkretnego na ten temat

{
            "id": 1,
            "id_user": 1,
            "id_comment": 1,
            "answer": "...",
            "post_id": 1
        }

Moim zdaniem brakuje Ci tutaj jeszcze takiego pola jak np post_id , który będzie informował o tym do jakiego ID Postu ma się odwoływać komentarz. Bo w tej chwili on nie wie do jakiego postu ma być odpowiedź i dlatego wyświetla je przy wszystkich. Zrób sobie relacje i później wyświetlaj tylko powiązane dane :).

Dokładnie jak napisał kolega wyżej

potem po prostu sobie filtrujesz

Comment::where(post_id = $post_id)->where(comment_id = $commend_id)->get();

przekazujesz a potem w vue i robisz kolejna petle zeby wyswietlic subkomentarze

znaczy...mam id_post więc wiem do którego postu odwołuje się komentarz a dawać id_post w tabeli z odpowiedziami do komentarza chyba nie ma sensu no bo i po co? skoro odpowiedź jest do komentarza więc jest tam id_comment może się mylę ale wydaje mi się że to nic nie da. Chodziło mi głównie o to że jak mam pętlę która wyświetla komentarze i powiedzmy wyświetli 10 wyników o ID (1-10) a następnie w tej pętli zrobię drugą pętlę która ma wyświetlić odpowiedzi do tych komentarzy i powiedzmy że odpowiedź dotyczy komentarza o id 1 to faktycznie zostanie treść odpowiedzi do tego komentarza ale pod każdym z komentarzy.

@arczinosek: robięt o mniej więcej tak

<div class="view-comments" v-for="item in comments">
<div class="content-comment">
{{item.comment}}
</div>
   <div class="view-answers-comment" v-for="item in answers">
    <div class="content-answer">
      {{item.answer}}
    </div>
   </div>
</div>

czyli pętla komentarzy i w tej pętli pętla z odpowiedziami do komentarza

michalos25 napisał(a):

@arczinosek: robięt o mniej więcej tak

<div class="view-comments" v-for="item in comments">
<div class="content-comment">
{{item.comment}}
</div>
   <div class="view-answers-comment" v-for="item in answers">
    <div class="content-answer">
      {{item.answer}}
    </div>
   </div>
</div>

czyli pętla komentarzy i w tej pętli pętla z odpowiedziami do komentarza

W takim razie brakuje mi tam ifa, ale nie wiem jak to się robi w Vue. W drugiej pętli zmnieńmy sobie nazwę z item na answerItem, żeby nie kolidowała. No i teraz coś w stylu: if (answerItem.comment_id == item.id) i wyświetlasz.

Lepszym rozwiązaniem jednak byłoby, gdybyś mógł zrobić coś na zasadzie: answer in item.answers. Czyli musiałbyś dostać JSONa mniej-więcej w takiej formie:

{
  "comments": [
    {"comment": "komentarz #1", "answers": ["odpowiedz #1", "odpowiedz #2"]},
    {"comment": "komentarz #2", "answers": ["odpowiedz #3"]}
  ]
}