愿所有的美好和期待都能如约而至

如何在数组的.map中调用函数?

发布时间:  来源:互联网  作者:匿名  标签:error How can I call a function inside of a .map of arrays? exception IT资讯 javas  热度:37.5℃

本文介绍了如何在数组的.map中调用函数?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在通过道具传递一个函数,该函数用大写字母表示要映射的一些项。我在item.creator的项部分收到一个错误。我只是想知道为什么我会收到这个错误,而不能直接调用映射内部的函数。感谢您的帮助。

错误消息为行分析错误:意外标记,应为”,”。

父组件

export default function MainContent() {
  const techContent = useSelector(displayTechContent);
  const designContent = useSelector(displayDesignContent);

  const makeCapital = (words) => words.replace(/^w/, (c) => c.toUpperCase());

  return (
    <div className="container">
      <div className="topics-list">
        <div className="topic-row mb-5">
          <h2 className="topic-heading mb-4">Software Development</h2>

          <ContentCard data={techContent} capitalize={makeCapital} />
        </div>

子组件

export default (props) => (
  <div>
    <div className="resource-list">
      {props.data.map((item) => (
        <a key={item.id} href={item.link} className="resource-card-link mr-3">
          <div className="card resource-card mb-2">
            <div className="card-header">
              <h4 className="resource-title">{item.title}</h4>
              <span className="resource-creator">by: ***{props.capitalize({item.creator})}***.</span> <--this function
            </div>

            <div className="card-body py-3">
              <div className="resource-description mb-2">
                {item.description}
              </div>
              <div className="resource-type mb-2">
                <i className="fas fa-book"></i> {item.type}
              </div>

推荐答案

item.creator的花括号是多余的。

export default (props) => (
  <div>
    <div className="resource-list">
      {props.data.map((item) => (
        <a key={item.id} href={item.link} className="resource-card-link mr-3">
          <div className="card resource-card mb-2">
            <div className="card-header">
              <h4 className="resource-title">{item.title}</h4>
              <span className="resource-creator">by: ***{props.capitalize(item.creator)}***.</span> <--this function
            </div>

            <div className="card-body py-3">
              <div className="resource-description mb-2">
                {item.description}
              </div>
              <div className="resource-type mb-2">
                <i className="fas fa-book"></i> {item.type}
              </div>

这篇关于如何在数组的.map中调用函数?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,

勇敢去编程!

勇敢的热爱编程,未来的你一定会大放异彩,未来的生活一定会因编程更好!

TOP