定义了一个skill组件,点击它会打开一个新页面
handleOpen(res){
window.open("details.html");
console.log(datas);//这里可以拿到点击的数据但是怎么传给新开页面的组件呢?
},
render() {
return (
<div className="photo">
<h2 className="lastest-title-photo">最新作品
</h2>
<Row className="skill">
{
this.state.data.map(function(res){
return <Col span="24" key={res.ID} ref="myTextInput">
<div className="slil-card" >
<div className="skill-img" onClick={this.handleOpen.bind(this,res)}>
<img src={res.URL} />
</div>
<div className="skill-content">
<h2 className="skill-title"><span onClick={this.handleOpen.bind(this,res)}>{res.TITLE}</span></h2>
<p className="skill-subtext">{res.SUBTEXT}</p>
</div>
</div>
</Col>
},this)
}
</Row>
</div>
);
我想要在另一个jsx文件中得到我所点击元素的数据该怎么做?
import ReactDOM from 'react-dom';
import React from 'react';
import { render } from 'react-dom';
import Skill from '../component/Skill';
import '../details/all.less';
const App = React.createClass({
getInitialState: function() {
//怎么获取到点击元素的数据?
},
render() {
return (
<div>
<div className="details-head">
<img src=""/>
</div>
</div>
)
}
});
ReactDOM.render(<App />, document.getElementById('web-main1'));
两个思路,第一个:
构建父子组件,通过父来当数据中心,子分别从其中取值
使用或自己定义数据中心,如redux,localstorage等
版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。