定义一个函数以将其作为 props 传递，但出现编译错误

Question

我有一个 React 组件试图将一个函数传递给另一个组件，问题是我无法定义该函数，它会引发编译错误

export default function App() {

createActivity() {      // here I get an error: missing semicolon
    console.log("creating activity");
}

return ( 
    <div className = "App" >
       <Route path="/" component={ Header } />  
       <Route exact path="/" component={ShowSplashWindow} />  
       <Route path="/createactivitiy" render = {() =>
              <CreateActivity createActivity={this.createActivity} />} />
    </div>
    );
}

我错过了什么？

拉斐尔

Answer 1

您将组件声明为功能组件，但试图创建一个 class 方法。

您应该使用 class 组件：

export default class App extends React.Component {...

有 2 种方法：createActivity 和 render。

或者声明你的函数并赋值给常量

    const createActivity = () => ...

但不使用 this:

   <CreateActivity createActivity={createActivity} />

Answer 2

函数必须声明为

const createActivity = () => {
    console.log("creando la actividad");
}

并且当作为 props 传递时，不应使用“this”调用它

<CreateActivity createActivity={createActivity} />}

定义一个函数以将其作为 props 传递，但出现编译错误

defining a function to pass it as props, but I get a compiling error

javascript

reactjs

react-router

react-props

react-component