我可以将prop作为函数参数传递,还是不好的做法?

时间:2019-12-11 18:04:23

标签: javascript reactjs jsx

我想知道这样做是否被认为是不好的做法?

const renderComparisonScore = (score) => {
 return (
  <div>
   {score}
  </div>
 )
}
const Visualization = ({ score }) = {
 return (
  <div>
   {renderComparisonScore(score)}
  </div>
 )
}

如您所见,我正在调用函数renderComparisonScore并传递参数,我知道执行此类操作的常规方法是将其作为道具传递:

const ComparisonScore = ({ score }) => {
 return (
  <div>
   {score}
  </div>
 )
}
const Visualization = ({ score }) => {
 return (
  <div>
   <ComparisonScore score={score} />
  </div>
 )
}

我的问题是,我是否可以将响应中的事物作为参数传递,而不是使用props传递事物?

1 个答案:

答案 0 :(得分:1)

我的.02:

在大型应用程序中,如果遇到这种情况(例如,需要映射大量数据以构建视图)。

const MyComponent = props => {
  const cards = props.arrayOfData.map(el => (
    <div>Lots of view code and styling</div>
  ));

  // ...

  return (
    <div>
      [...other components]
      {cards}
    </div>
  );
};

这将有助于尝试将任何给定组件中呈现的内容量最小化到更可管理的量。

除了这种情况之外,我绝对会坚持使用常规道具,因为您想要保持状态和基于逻辑与基于视图的相对有序性