javascript - React 中的 render 方法总是有义务的吗？

Question

我通过做 React 来学习，我认为 React 中的 render 方法是必须的，但我看到了以下组件:

export const GoogleButton = withStyles(theme => ({
  root: {
    height: 55,
    width: 255,
    margin: theme.spacing(5, 0, 2),
    padding: theme.spacing(0, 1),
    justifyContent: 'start',
    background: theme.palette.background.default,
  },
  startIcon: {
    marginRight: 20,
    paddingRight: 3,
    borderRight: `1px solid ${theme.palette.text.primary}`,
    background: 'none',
  },
}))(Button);

type AllProps = OwnProps & StateProps & DispatchProps;

export const GoogleLoginButtonPure = ({ isInProgress, login }: AllProps) => {
  const handleClick = useCallback(() => login(), [login]);
  const { t } = useTranslation();
  return (
    <GoogleButton
      disabled={isInProgress}
      onClick={handleClick}
      fullWidth
      variant="contained"
      startIcon={GOOGLE_ICON}
    >
      {t('login.button')}
    </GoogleButton>
  );
};

代码运行顺利，但任何人都可以解释我为什么该组件没有 render 方法？

Answer 1

Render方法仅在类组件中使用。您的组件是函数式的，因此无法使用渲染方法。