reactjs - 找不到错误

Question

我知道这是一个小问题，也许是一个愚蠢的问题，但我被一个我看不到的错误卡住了大约一个小时。这是我的代码：

const ModalRoot = ({ modalType, modalProps, locale }) => {
  if (!modalType) {
    return <span />;
  }

  return (
    <IntlProvider
      locale={locale}
      key={locale}
      messages={messagesFor(locale)}
    >
      <div className="backdrop">
        {renderAppropriateModal(modalType, modalProps)}
      </div>
    </IntlProvider>
  );
};

控制台在 if 表示意外令牌中显示错误。为什么会这样？？

Answer 1

这可能是你的错误...

检查这个样本。

报错地点。

import React from 'react';

class YOURCLASS extends React.Component {
   constructor(props) {
     super(props);

   }

   //do not place this ModalRoot here
   const ModalRoot = ({ modalType, modalProps, locale }) => {
      //contents
   }

   render(){
     return(
        <div>{yourContent}</div>
     );
   }
}

正确的申报地点

import React from 'react';

//Place it here outside the class YOURCLASS
const ModalRoot = ({ modalType, modalProps, locale }) => {
      //contents
}

class YOURCLASS extends React.Component {
   constructor(props) {
     super(props);

   }



   render(){
     return(
        <div>{yourContent}</div>
     );
   }
}

如果你仍然打算在课堂上做......最好使用函数......

import React from 'react';

class YOURCLASS extends React.Component {
   constructor(props) {
     super(props);

   }

   //function type ModalRoot
   ModalRoot(modalType, modalProps, locale){
      //contents
      return <IntlProvider />;
   }

   render(){
     const {modalType, modalProps, locale} = this.props;
     let yourContent = this.ModalRoot(modalType, modalProps, locale);
     return(
        <div>{yourContent}</div>
     );
   }
}

希望能帮助到你...