javascript – 什么归类为React功能组件?

前端之家收集整理的这篇文章主要介绍了javascript – 什么归类为React功能组件?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

我正在关注Udemy的教程,教师正试图解释HOC.

为了解释HOC,他创建了一个具有功能组件的功能(至少这是他所说的).这是代码

const withClass = (WrappedComponent,className) => {
     return (props) => (
         

React文档显示了这个示例:

function Welcome(props) {
  return 

并提到:

This function is a valid React component because it accepts a single “props” (which stands for properties) object argument with data and returns a React element. We call such components “functional” because they are literally JavaScript functions.

[题]

简单来说,可以肯定地说:任何以道具为参数的函数都可以归类为功能组件吗?如果没有,有人可以简单地解释一下React中的功能组件吗?

最佳答案

Any function which takes props as an argument can be classified as
a functional component?

不,道具只是函数参数,就像所有其他正常的函数参数一样.因此,如果我们定义接受参数的任何函数,它不一定是React功能组件,就像这不是React组件:

const Testing = props => {
   const a = 10;
   return a * props.a;
}

重要的部分是“如果该组件返回一个React元素”,那么它才会成为React功能组件.

为了更清楚,只需在单独的文件中定义下面的函数;你转换时不会抛出任何错误

const Test = props => props.key * 10;

但是如果你在一个单独的文件中定义下面这个组件而不导入React,它会抛出错误,当你转换时没有定义React:

const Test = props => 

因为JSX将转换为React.createElement(….)并且将需要React.上述组件的converted version将是:

var Test = function Test(props) {
  return React.createElement(
    "div",null,props.key * 10
  );
};

我建议,使用Babel REPL并定义两个函数并检查输出.

原文链接:https://www.f2er.com/js/429262.html

猜你在找的JavaScript相关文章