У меня три компонента Topicscreen
, Listview
, Listrow
. Я передаю renderrowtion Topicscreen
, а две других свойств , определенных в моих Listview
к func
.
Теперь , когда я называю func
в Listview
, реквизит передается , Listrow
как определенно в renderrow
функции, но onRowclick
функция , которая передается на Listrow
это , undefined
когда я проверил его Listrow
.
Как решить эту ошибку и перейти onRowclick
как функция Listrow
?
class Topicscreen extends Component {constructor () {super (); this.onRowClick = this.onRowClick.bind (this); } componentDidMount () {this.props.dispatch (topicaction.Fetchtopics ()); } renderLoading () {return <p> Загрузка ... </ p>; } renderrow (rowid, topic) {// const selected = this.props.checkselection [rowid] const selected = ""; return (<Listrow selected = {selected} click = {this.onRowClick} rowid = {rowid}> <h3> {topic.title} </ h3> <p> {topic.description} </ p> </ Listrow> ); } onRowClick (rowid) {this.props.dispatch (topicaction.selectedchoice (rowid)); } render () {if (! this.props.topicsByurl) возвращает this.renderLoading (); return (<div className = "TopicsScreen"> Привет, я - экран темы <h1> Выберите любые три из нижеперечисленных тем </ h1> <Listview rowid = {this.props.topicsurlArray} row = {this.props.topicsByurl} func = {this.renderrow} /> </ div>); }} .js
import React, { Component } from "react";
import _ from "lodash";
export default class Listview extends Component {
constructor() {
super();
this.show = this.show.bind(this);
}
show(rowid) {
return this.props.func(rowid, _.get(this.props.row, rowid));
}
render() {
console.log("props in listview", this.props);
return (
<div>
<ul>{_.map(this.props.rowid, this.show)}</ul>
</div>
);
}
}
Listview.js
import React, { Component } from "react";
export default class Listrow extends Component {
clicking() {
this.props.clicking(this.props.rowid);
}
render() {
console.log("list row called");
console.log("listrow props", this.props);
const background = this.props.selected ? "#c0f0ff" : "#fff";
return (
<div style={{ background }} onClick={this.clicking.bind(this)}>
{this.props.children}
</div>
);
}
}
Listrow.js
renderrow
javascript,reactjs,