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}
)