如何禁用React的「警告：未知道具」？

我想使用一個自定義的道具進行測試，我稱之爲「dataHook」，使用它時我得到這個警告。如何禁用React的「警告：未知道具」？

示例代碼：

<div dataHook="header-title">test me</div>

上運行時，我會得到這樣的：

Warning: Unknown prop `dataHook` on <div> tag. Remove this prop from the element. 
    in div (created by GBT)

我明白爲什麼警告顯示，但我知道的情況下，該代碼是我完全沒問題，如何禁用？

來源

2017-04-05 Guy Ben-Moshe

dataHook不是div元素接受的有效屬性。如果你想使用HTML5數據 - *屬性，則需要使用連字符是：

<div data-hook="header-title">...</div>

在反應過來，所有的DOM屬性和屬性（包括事件處理程序）應遵循駝峯格式。例如，HTML屬性tabindex對應於React中的屬性tabIndex。 例外是aria- *和data- *屬性，應該小寫。

— React's documentation on DOM Elements

或者你也可以創建一個返回div元素自己的自定義組件：

class MyComponent extends React.component { 
    render() { 
    const { children, dataHook } = this.props; 

    // do something with the custom property 

    return <div>{children}</div> 
    } 
} 

... 

<MyComponent dataHook="header-title">...</MyComponent>

來源

2017-04-05 08:08:54

如何禁用React的「警告：未知道具」？

回答

相關問題