react传递方法 警告

报错现象以下

产生缘由以下

分析

在调用 React.cloneElement 的时候 若是第二个属性传入props, 须要看第一个参数传递的是 react组建仍是 html标签

若是是html标签就会致使上面的警告

大意是方法会被忽略 由于这样至关于 往 div 等原声元素里 传入 onBd 自定义事件 是会被忽略等

错误代码/场景分析

咱们在弹窗里传入

123

以及 两个回掉事件

<PopOver titleDone="Done" visible={this.state.showFilterFlag}
          onShow={() => console.log('done actio1n')}
                    onDone={() => console.log('done action')}>
          {/* <FilterRecipient></FilterRecipient> */}
              <div>123</div>
        </PopOver>

弹窗组建 会把两个事件绑定在头部等两个按钮回掉里，同事吧 外部传进来的 children 做为内容，

产生错误就是由于 { onBd: onShow, onD: onDone }这一句

为何要加这一句？

由于考虑到 有一种状况 是须要外部传进来的组建能够调用 onShow 和onDone 这个方法。好比我想点击123 时候关闭弹窗,

解决办法也很简单

外部不要传入

123

这样的元素 而是传递 react组建进来

好比 function demo() {return

123

} 由于只有组建才能接受props

补充

若是直接 写以下代码 是不报错的

var  onShow = function() {

}
var  onDone = function() {

}
var a = React.cloneElement(
<div>123</div>, {onShow, onDone}
)