Javascript METEOR REACT搜索和显示onChange用户输入需要帮助解决错误

这是输入代码：

这是从订阅获取参数的publish方法的位置：

这是带有索引的集合代码：

export const Articles = new Mongo.Collection('articles');

if(Meteor.isServer) {
  Articles._ensureIndex({
    articleTitle: "text",
  });
}

这是显示搜索结果的位置：

render() {
    return (
      this.props.articles.map( (article) => {
        const dateCreated = article.createdAt.toString();
        const dateUpdated = article.updatedAt.toString();
        return (
          <div key={article._id} className="article_list_editable">
            <h1>{article.articleTitle}</h1>
            <br/>
            <h1>{article.articleAuthor}</h1>
            <div>{dateCreated}</div>
            <div>{dateUpdated}</div>
            <div>{article.articleType}</div>
          </div>
        )
      })
    )
  }

---

看起来你们需要用一些包装器来包装地图，比如

 render() {
        return (
          <div>{
            this.props.articles.map( (article) => {
            const dateCreated = article.createdAt.toString();
            const dateUpdated = article.updatedAt.toString();
            return (
              <div key={article._id} className="article_list_editable">
                <h1>{article.articleTitle}</h1>
                <br/>
                <h1>{article.articleAuthor}</h1>
                <div>{dateCreated}</div>
                <div>{dateUpdated}</div>
                <div>{article.articleType}</div>
              </div>
            )
          }
        )
      }</div>
    )
  }

render（）{
返回(
{
this.props.articles.map（（article）=>{
const dateCreated=article.createdAt.toString（）；
const dateUpdated=article.updatedAt.toString（）；
返回(
{article.articleTitle}


{文章.文章作者}
{dateCreated}
{dateUpdated}
{article.articleType}
)
}
)
}
)
}

因为映射返回数组，但只能返回单个组件，不能返回数组

Meteor.publish('search_results', function (articleTitle) {
    if(articleTitle) {
      return Articles.find({articleTitle});
    }
  });

export const Articles = new Mongo.Collection('articles');

if(Meteor.isServer) {
  Articles._ensureIndex({
    articleTitle: "text",
  });
}

render() {
    return (
      this.props.articles.map( (article) => {
        const dateCreated = article.createdAt.toString();
        const dateUpdated = article.updatedAt.toString();
        return (
          <div key={article._id} className="article_list_editable">
            <h1>{article.articleTitle}</h1>
            <br/>
            <h1>{article.articleAuthor}</h1>
            <div>{dateCreated}</div>
            <div>{dateUpdated}</div>
            <div>{article.articleType}</div>
          </div>
        )
      })
    )
  }

Error: Article_Editable_List.render(): A valid React element (or null) must be returned. You may have returned undefined, an array or some other invalid object.

 render() {
        return (
          <div>{
            this.props.articles.map( (article) => {
            const dateCreated = article.createdAt.toString();
            const dateUpdated = article.updatedAt.toString();
            return (
              <div key={article._id} className="article_list_editable">
                <h1>{article.articleTitle}</h1>
                <br/>
                <h1>{article.articleAuthor}</h1>
                <div>{dateCreated}</div>
                <div>{dateUpdated}</div>
                <div>{article.articleType}</div>
              </div>
            )
          }
        )
      }</div>
    )
  }