警告未知支柱

使用React.createClass({})我可以輕鬆地將道具傳遞給子組件。如何處理React.Component{}？警告未知支柱

export default class Parent extends React.Component { 
    // imported Child and in the render: 
    render(){ 
    return <Child name={this.state.foo} /> 
    } 
} 

export default class Child extends React.Component { 
}

警告未知道具「名」

來源

2016-09-12 Sylar

傳遞prop的方式是一樣的，但是你需要檢查你是否正確定義狀態變量。看下面的實現。上述錯誤可能有一組原因：

您使用{... this.props}還是cloneElement（element，this.props）？您的組件正在將其自己的道具直接轉移給孩子元素（例如， https://facebook.github.io/react/docs/transferring-props.html）。當將道具轉移到子組件時，您應確保您不會意外轉發旨在由父組件解釋的道具。

您在本地DOM節點上使用非標準DOM屬性，可能表示自定義數據。如果您嘗試將自定義數據附加到標準DOM元素，請考慮使用MDN中描述的自定義數據屬性。

React尚未識別您指定的屬性。這可能會在未來版本的React中修復，其中可能會被修復。但是，React目前的會去除所有未知屬性，因此在您的React應用程序中指定它們不會導致它們被渲染。

還要檢查您使用的是哪個版本的反應，以及您是否正確設置了反應以使用ES6語法。

PS：我使用的版本0.14.8用於以下代碼段

class Parent extends React.Component { 
 
    // imported Parent and in the render: 
 
    constructor(){ 
 
    super(); 
 
    this.state = { 
 
     foo: 'Hello World' 
 
    } 
 
    } 
 
    render(){ 
 
    return <Child name={this.state.foo} /> 
 
    } 
 
} 
 

 
class Child extends React.Component { 
 
    
 
    render() { 
 
    return (
 
     <div>{this.props.name}</div> 
 
    ) 
 
    } 
 
} 
 

 

 
ReactDOM.render(<Parent />, document.getElementById('container'));

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.8/react.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.8/react-dom.min.js"></script> 
 
<div id="container"></div>

來源

2016-09-12 06:59:31

這裏是警告的完整解釋：https://facebook.github.io/react/warnings/unknown-prop.html

基本上，它似乎要傳遞的name支撐下來的HTML元素不支持name屬性。

來源

2016-09-12 06:50:09

警告未知支柱

回答

相關問題