Javascript 如何将常量变量作为React中的道具传递给组件？

我试图将wantedAirline变量传递到AirlineSection组件中，但我不断收到错误

TypeError:无法从AirlineSection组件内部读取未定义的属性“wantedAirline”

render() {
    const wantedAirline = this.state.wantedAirline.filter(p =>
      p.name.includes(this.state.searchTerm)
    )
    return (
      <div>
        <header>Pokemon Searcher</header>

        <AirlineSection 
        wantedAirline = {wantedAirline}
        airlines = {this.state.airlines}
        handleDelete={this.handleDelete}/>

      </div>
    )
  }

render（）{
const wantedAirline=this.state.wantedAirline.filter（p=>
p、 name.includes（this.state.searchTerm）
)
返回(
口袋妖怪搜索者
)
}

AirlineSection组件如下所示：

function AirlineSection(props){
    console.log(props, 'airline section props');
    return(
        <div>
            <h2>Airlines</h2>
            {props.airlines.map(airline => <AirlineCard key={airline.id}  wantedAirline={this.wantedAirline} airline={airline} handleDelete={props.handleDelete}/>)}
        </div>
    )
}

功能航线部分（道具）{
控制台日志（道具，“航空公司部分道具”）；
返回(
航班
{props.airlines.map（airline=>）}
)
}
将
wantedAirline={this.wantedAirline}
替换为
wantedAirline={props.wantedAirline}
，就像
AirlineSection
是您的功能组件一样

render() {
    const wantedAirline = this.state.wantedAirline.filter(p =>
      p.name.includes(this.state.searchTerm)
    )
    return (
      <div>
        <header>Pokemon Searcher</header>

        <AirlineSection 
        wantedAirline = {wantedAirline}
        airlines = {this.state.airlines}
        handleDelete={this.handleDelete}/>

      </div>
    )
  }

您正在将
wantedAirline
作为道具传递，因此您还必须使用道具访问它