我rewest到reactjs。更改下拉列表中的表顺序不会更改。
组件确实挂载事件功能***
componentDidMount() {
this.setQuestionCount();
this.setQuestionList();
} }
表体的 renderAgent 函数
renderAgents = (agent, index) => {
return (
<tr key={index}>
<td>{agent.REF_NO}</td>
<td>{Moment(agent.DATE).format('YYYY-MM-DD')}</td>
<td>{agent.DEVISION}</td>
<td>{(agent.JOB_ROLE)}</td>
<td>
<Link to={{
pathname: '/questionnaireView',
state: agent.REF_NO
}} ><FolderViewOutlined style={{ fontSize: 25 }} /> View</Link>
</td>
{/* <td>{agent.status}</td> */}
</tr>
);
}
这是我的 onChange 函数
fucntion onChangeOrder = (e) => {
console.log("order-" + e.target.value);
this.setState({ orderBy: e.target.value });
}
下拉式菜单
`<div className="form-group filter-input-container">
<label htmlFor="company">Sort by</label>
<select
id="company"
className="form-control filter_dropdown"
value={this.state.orderBy}
onChange={this.onChangeOrder}
>
<option value="true" selected>Newest</option>
<option value="false">Oldest</option>
</select>
</div>`
平面列表表
<table className="table">
<thead>
<tr>
<th scope="col">Reference</th>
<th scope="col">Date</th>
<th scope="col">Devision</th>
<th scope="col">Job Role</th>
<th scope="col">Questionnaire</th>
</tr>
</thead>
<tbody>
<FlatList
list={this.state.agentsList}
renderItem={this.renderAgents}
renderWhenEmpty={this.showBlank}
hasMoreItems={this.state.hasMore}
loadMoreItems={this.fetchData}
search={{
by: "DEVISION",
term: this.state.dvsn,
caseInsensitive: true,
minCharactersCount: 1,
onEveryWord: false,
by: this.handleSearchMatch
}}
sort={{
by: ["DATE", { key: "DATE", descending:
this.state.orderBy}],
descending: true,
caseInsensitive: true
}}
/>
[![enter image description here][1]][1]
</tbody>
</table>
当页面加载和硬编码下降为 true 时,它可以工作,但不会通过下拉菜单更改内容。成功响应 orderBy 状态更改。请帮我修复