小编Lor*_*eiß的帖子

所以我试图为我的组件对象添加一个形状.对象从服务器加载,因此从一开始就不存在.但是当我将形状添加到Proptypes时.它不断抛出标记为必需的错误,但事实并非如此.

是shape或objectOf自动添加isRequired值？

TopicsList.propTypes = {
  topicsObject: PropTypes.shape(reportsTopicsObjectResultShape),
};

形状:

export const reportsTopicObject = PropTypes.shape({
 avg_rating_ord: PropTypes.number,
 cards_with_comments: PropTypes.number,
 cards_without_comments: PropTypes.number,
 number_of_questions: PropTypes.number,
 rating_count: PropTypes.number,
 scale_version_id: PropTypes.string,
 scale_id: PropTypes.string,
 last_answered_at: PropTypes.string,
 id: PropTypes.string,
 type: PropTypes.string,
 name: PropTypes.shape(translatedObjectSystem),
 description: PropTypes.shape(translatedObjectSystem)
});

export const reportsTopicsObjectResultShape = PropTypes.shape({
 topics_distribution: PropTypes.shape({
    general: PropTypes.number,
    groups: PropTypes.number,
    people: PropTypes.number
}),
 topic_list: PropTypes.objectOf(reportsTopicObject)
});

我仍然得到错误

Failed prop type: The prop `topicsObject.isRequired` is marked as 
required in `TopicsList`, but its value is `undefined`. …

我正在尝试在 React 中模拟悬停事件。所以我正在使用onMouseEnter并onMouseLeave 触发状态变化。

不幸的是，当我第一次用鼠标进入 Element 时，两种方法都会被触发......

当我离开元素时，只有 onMouseLeave is triggered. Does anyone knows why the methodonMouseLeave` 在进入元素时被触发。

这是我的代码：

   handleOver(event){
        event.preventDefault();
        console.log('enter');
        if(this.state.open === false){
            this.setState({
                open: true,
                anchorEl: event.currentTarget,
            });
        }
    }
    
    handleLeave(event){
         event.preventDefault();
         console.log('leave');
         if(this.state.open === true){
             this.setState({open: false})
         }
    }

                    <img
                        onMouseEnter={this.handleOver}
                        onMouseLeave={this.handleLeave}
                        src={InfoIcon}
                    />
                    
                    <Popover
                        open={this.state.open}
                        anchorEl={this.state.anchorEl}
                        anchorOrigin={{horizontal: 'right', vertical: 'top'}}
                        targetOrigin={{horizontal: 'left', vertical: 'top'}}
                        onRequestClose={this.handleLeave}
                        muiTheme={darkBaseTheme}
                    />