我是react
的新手并尝试构建api
。
我的问题是props
我使用onClick
函数抛出错误,从子组件传递到父组件。
我甚至试图使用这个关键字,但我无法弄清楚发生了什么错误。
我发现我的StockContent
组件没有收到我从正文组件传递的showOverlay
道具
我打算使用onClick功能更改网址,导航到当前点击内容。
整个项目都在这里...... https://github.com/Kushan-/stockStimulation
{
import React from 'react';
import ReactDOM from 'react-dom';
import StockContent from '../bodyRoutes/StockContent.js'
import ShareOverlay from '../bodyRoutes/SharesOverlay.jsx'
const pushState = (obj, url) => window.history.pushState(obj, '', url);
class Main extends React.Component{
state = {
content: []
}
componentDidMount(){
$.ajax({
url: '/data',
context: this,
dataType: 'json',
type: 'GET'
}).done(function (res) {
console.log(res)
this.setState({
content:res
});
})
}
componentWillUnmount(){
//clean timers, listners
}
fetchStock = (stockName, stockId) => {
const url = '/'+stockName+'/'+stockId;
const obj = {currentStockName : stockName, currentStockId : stockId}
pushState(obj,url);
this.setState({
currentStockName: stockName,
currentStockId: stockId
})
};
displayPop(){
if(this.state.currentStockId) {
console.log(this.state.content[this.state.currentStockId]);
const data= this.state.content[this.state.currentStockId];
return(<div className="row" ><ShareOverlay stockData={data}/></div>)
}
return(<StockContent showOverlay={this.fetchContent} content={this.state.content}/>)
}
render(){
return(
<div>
{this.displayPop()}
</div>
)
}
}
export default Main;
}