Question

我有一个关于React功能组件的问题，特别是关于功能组件中的功能的问题。例如：

    function WorkshopComponent(props) { 

      function renderWorkshopElements() {
           props.elements.map((element) => {return <Element key={element.id} {...element} />})
      }

      return (<div> renderWorkshopElements() </div>) 

    }

我的问题：是否有一个参数只能在组件级函数内使用props对象？写这个更好吗？

function WorkshopComponent(props) { 

      function renderWorkshopElements(elements) {
           elements.map((element) => {return <Element key={element.id} {...element} />})
      }

      return (<div> renderWorkshopElements(props.elements) </div>) 

    }

Answer 1

我认为这是一个非常好的问题，我想听听其他人的意见。

在您的第一个示例中，您拥有范围的力量，我认为这是很好的。只有在我的作用域中没有值时（例如：事件，数组元素等），我才在函数中使用参数。

在第二个示例中，有趣的是，您甚至不需要将此函数包含在WorkshopComponent中，可以在它旁边声明它，并且可以使用相同的功能（明智地进行渲染）。如果您要对该功能进行单元测试，那就太好了。

tl; dr：我说大多数情况下，版本1更有意义

反应组件功能正常

1 个答案: