我是ReactJS和Javascript的新手,我偶然发现了根据用户点击的组件过滤输出数据的问题。
继承正在输出过滤器的Filter.js组件。我评论了我卡住的部分。我不清楚我应该在.filter()中添加什么逻辑来过滤掉过滤器容器下显示的公寓。
import React from 'react';
import { ReactRouter, Link } from 'react-router';
var Filter = React.createClass({
getInitialState() {
return {
selected: []
};
},
getDefaultProps() {
return {
filterList: [],
name: '',
id: '',
props: []
};
},
render() {
var selected = [];
var handleClick = function(i, filterList) {
this.setState({clicked: i});
var index = this.state.selected.indexOf(i);
if (index === -1) {
this.state.selected.push(i);
} else {
this.state.selected.splice(index, 1);
}
}
var className = this.state.clicked ? 'selected' : '';
return (
<div id={this.props.id} className="filterCloud quarter-section">
<h3>{this.props.name}</h3>
<ul>
{this.props.filterList.filter({/* I dont know what to put in here */}).map(function(listValue, i) {
return <li
className={this.state.selected.indexOf(i) > -1 ? 'selected' : ''}
onClick={handleClick.bind(this, i, this.props.filterList)}
key={i}>
{listValue}
</li>;
}, this)}
</ul>
</div>
)
}
});
export default Filter;
我想获取所选过滤器的数据并使用该数据过滤出公寓。我不清楚这样做的最佳方式。