Как отобразить вложенный объект в реакцию на рельсы связанных моделей?

Question

после настройки простой модели поста с большим количеством комментариев, каков наилучший способ получить комментарии из поста с реакцией?

для примера в рельсах цикл будет:

<ul>
<%= @post.comments.each do |c| %>
     <li><%= c.title %></li> 

<% end %>
</ul>

в реакции карта эквивалентна, но в этом случае карта объекта по-прежнему путает.

var comments = this.state.comments.map(c => {

              return (
                 <div key={comment.id}>
                <ul >


                  <li>{comment.title}</li>


                </ul>

                  </div>

              );

            });

, поэтому я попробовал это, и, как ожидалось, не сработало.Итак, у кого-нибудь есть подсказка на карте вложенных массивов при реагировании?

 var post = this.state.post.map(p => {

                  return (
                     <div key={comment.id}>
                    p.comments.map(c => {
                   <div key={ct.id}></div>
});

                      </div>

                  );

                });

Answer 1

Любой из двух вариантов подойдет вам.Вы должны выполнить условную проверку для вложенного массива и добавить возврат.

Ниже .map работает с возвращением

       const postItems = this.state.post && this.state.post.map(p => {
              return (
                 <div key={comment.id}>
                    if(p.comments){
                         p.comments.map(c => {
                             return <div key={ct.id}></div>
                         });
                     }
                  </div>
              );
            });

Или .map работает без возврата

         const postItems = this.state.post &&  this.state.post.map(p => (
                 <div key={comment.id}>
                    if(p.comments){
                          p.comments.map(c => (
                               <div key={ct.id}></div>
                          ));
                    }
                  </div>
            ));