Как я могу отобразить {post.body} в виде списка сообщений в Meteor Telescope Nova?

Question

Прямо сейчас {post.htmlBody} будет отображаться на отдельной странице сообщения, но не в представлении списка сообщений. Первый блок кода - мой CustomPostsItem.jsx. Под тегами h3 вы увидите, что я пытаюсь отобразить {post.htmlBody}, как определено вверху. Это не заполняется, когда CustomPostsItem.jsx вызывается во втором блоке кода, который является PostsList.jsx. Он заполняется и отображается правильно, когда CustomPostsItem.jsx вызывается в третьем блоке кода, который является PostsPage.jsx. Это означает, что он не отображается на моей домашней странице, но будет отображаться на отдельной странице публикации, даже если один и тот же файл CustomPostsItem.jsx вызывается оба раза. Я также пытался использовать только {post.body} вместо htmlBody, но происходит то же самое.

import React, { PropTypes, Component } from 'react';

class CustomPostsItem extends Telescope.components.PostsItem {

  render() {

    ({UsersAvatar, UsersName, Vote, PostsStats, PostsThumbnail} = Telescope.components);

    const post = this.props.post;
    const htmlBody = {__html: post.htmlBody};

    let postClass = "posts-item"; 
    if (post.sticky) postClass += " post-sticky";

    // ⭐ custom code starts here ⭐
    if (post.color) {
      postClass += " post-"+post.color;
    }
    // ⭐ custom code ends here ⭐

    return (
      <div className={postClass}>

        <div className="posts-item-vote">
          <Vote post={post} currentUser={this.props.currentUser}/>
        </div>

        {/*post.thumbnailUrl ? <PostsThumbnail post={post}/> : null*/}

        <div className="posts-item-content">

          <h3 className="posts-item-title">
            <a className="posts-item-title-link" href={Posts.getLink(post)} target={Posts.getLinkTarget(post)}>{post.title}</a>
            {this.renderCategories()}
          </h3>

          <div className="posts-page-body" dangerouslySetInnerHTML={htmlBody}></div>

        </div>

      </div>
    )
  }
};

export default CustomPostsItem;

import React from 'react';

const PostsList = ({results, currentUser, hasMore, ready, count, totalCount, loadMore, showHeader = true}) => {

  // console.log(results);
  // console.log(ready);
  // console.log(hasMore);
  // console.log(totalCount);
  // console.log(count);

  if (!!results.length) {
    return (
      <div className="posts-list">
        {showHeader ? <Telescope.components.PostsListHeader /> : null}
        <div className="posts-list-content">
          {results.map(post => <Telescope.components.PostsItem post={post} currentUser={currentUser} key={post._id}/>)}
        </div>
        {hasMore ? (ready ? <Telescope.components.PostsLoadMore loadMore={loadMore} count={count} totalCount={totalCount} /> : <Telescope.components.PostsLoading/>) : <Telescope.components.PostsNoMore/>}
      </div>
    )
  } else if (!ready) {
    return (
      <div className="posts-list">
        {showHeader ? <Telescope.components.PostsListHeader /> : null}
        <div className="posts-list-content">
          <Telescope.components.PostsLoading/>
        </div>
      </div>
    )
  } else {
    return (
      <div className="posts-list">
        {showHeader ? <Telescope.components.PostsListHeader /> : null}
        <div className="posts-list-content">
          <Telescope.components.PostsNoResults/>
        </div>
      </div>
    )  
  }

};

PostsList.displayName = "PostsList";

module.exports = PostsList;

import React from 'react';

const PostsPage = ({document, currentUser}) => {

  const post = document;
  const htmlBody = {__html: post.htmlBody};

  return (
    <div className="posts-page">

      <Telescope.components.HeadTags url={Posts.getLink(post)} title={post.title} image={post.thumbnailUrl} />

      <Telescope.components.PostsItem post={post}/>

      <div className="posts-page-body" dangerouslySetInnerHTML={htmlBody}></div>

      {/*<SocialShare url={ Posts.getLink(post) } title={ post.title }/>*/}

      <Telescope.components.PostsCommentsThread document={post} currentUser={currentUser}/>

    </div>
  )
};

PostsPage.displayName = "PostsPage";

module.exports = PostsPage;
export default PostsPage;

Answer 1

body не публикуется в posts.list Посмотреть, excerpt есть (чтобы не загружать слишком много данных). Если вы хотите опубликовать body а также, вы должны добавить его в Posts.publishedFields.list (см. https://github.com/TelescopeJS/Telescope/blob/master/packages/nova-posts/lib/published_fields.js)

Вы могли бы сделать:

PublicationUtils.addToFields(Posts.publishedFields.list, ["body"]);

См. https://github.com/TelescopeJS/Telescope.