Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/reactjs/27.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 此.props在方法中未定义_Javascript_Reactjs_Ecmascript 6 - Fatal编程技术网

Javascript 此.props在方法中未定义

Javascript 此.props在方法中未定义,javascript,reactjs,ecmascript-6,Javascript,Reactjs,Ecmascript 6,问题:当我尝试将面板传递到create tabs props内的createTabs()时,此.props未定义内的createTabs()。当我在consttabs=this.createTabs(panels)行的面板上放置断点时,面板有一个值,所以我知道这很好 我还希望得到反馈,说明我尝试在正确的生命周期方法中初始化选项卡(该调用)的位置 下面是一个屏幕广播,帮助您了解这个问题 import React,{Component,PropTypes}来自'React'; ... 导出默认类选项

问题:当我尝试将面板传递到create tabs props
内的createTabs()时,此.props
未定义
内的createTabs()。当我在
consttabs=this.createTabs(panels)行的面板上放置断点时
面板
有一个值,所以我知道这很好

我还希望得到反馈,说明我尝试在正确的生命周期方法中初始化选项卡(该调用)的位置

下面是一个屏幕广播,帮助您了解这个问题

import React,{Component,PropTypes}来自'React';
...
导出默认类选项卡扩展组件{
构造函数(){
超级();
....
};
此.state={
...
制表符:空,
};
this.createTabs=this.createTabs.bind(this);
...
}
组件willmount(){
const{panels}=this.props;
const panel=u2;.get(panels,'member.0');
国际单项体育联合会(小组){
this.tabChanged(0,u.get(panel,'headline'));
const filters=shapeFilters(u.get(面板'customViews'),this.setSelectedFilter);
this.setState({selectedFilter:(filters&&filters.length>0)?filters[0]:null});
}
const tabs=this.createTabs(面板);
this.setState({tabs});
}
组件将更新(下一步,下一步状态){
const{selectedTab:currentTab,panels:currentPanels}=this.props;
....
if(currentTab==nextTab)返回null;
const{panels}=this.props;
const filter={selectedFilter:null};
const nextFilterName=u2;.get(nextFilter,'name',null);
if(面板和下一个过滤器){
...
}
...
this.setState({filter});
}
createTabs(){
//这个.props没有定义,为什么?????
const tabs=this.props.panels.member.map((panel,idx)=>{
const{selectedTab}=this.props;
const{id:panelId,headline}=panel;
const url=getHeaderLogo(面板,50);
const item=url?:标题;
const classname=类名称([
searchResultsTheme.tabItem,
(idx==selectedTab)?searchResultsTheme.active:空,
]);
此.setFilter(面板、idx、selectedTab);
返回(
);
});
返回标签;
}
render(){
返回(
    {this.state.tabs}
); } } SearchTabs.defaultProps={ 小组:{}, ... }; SearchTabs.propTypes={ 面板:PropTypes.shape({}).isRequired, ..... }; export const TabItem=({classname,content,onclick,key})=>(
  • {content}
  • );
    除非在调用super时将道具显式传递到构造函数中,否则道具在类中不可用

    constructor(props) {
        super(props);
        ....
    
        };
    
        this.state = {
          ...
          tabs: null,
        };
    
        this.createTabs = this.createTabs.bind(this);
        ...
      }
    

    您需要将道具传递到构造函数中并调用super。谢谢,我会尝试一下。我想我已经习惯于连接容器了。
    this.createTabs=this.createTabs.bind(this)仅在您将函数作为事件处理程序传递到某个位置时才是必需的,但您没有这样做。谢谢@FelixKing,很好。
    
    constructor(props) {
        super(props);
        ....
    
        };
    
        this.state = {
          ...
          tabs: null,
        };
    
        this.createTabs = this.createTabs.bind(this);
        ...
      }