1

我正在使用 Griddle 组件并尝试自定义过滤器组件以满足要求。我收到Uncaught TypeError: this.props.onChange is not a function错误。我正在关注这个例子。https://griddlegriddle.github.io/Griddle/docs/customization/ 这里是组件。

列表组件:

class UserList extends React.Component {
render(){
const users = this.props.users;
return( 
<Griddle data={users} plugins={[plugins.LocalPlugin]} styleConfig={styleConfig} components={{Filter}} pageProperties={{pageSize: 5}}>
  <RowDefinition>
    <ColumnDefinition id="username" title="Username" className="" />
    <ColumnDefinition id="firstname" title="First Name" className="" />
    <ColumnDefinition id="lastname" title="Last Name" />
    <ColumnDefinition id="id" title="Action" customComponent={EditDeleteUser} />
  </RowDefinition>
</Griddle>
)
}
}export default UserList;

自定义过滤器组件:

import React from 'react';
import { browserHistory, Router, Route, Link, withRouter } from 'react-router';
class Filter extends React.Component {
constructor(props) {
super(props);
this.onChange = this.onChange.bind(this);
}  
onChange(e) {
 this.props.onChange(e.target.value);
}
render() {
 return (
            <div className="searchInput">
                <input 
                  type="text" 
                  className="form-control"
                  placeholder="search" 
                  onChange={this.onChange}
                />
                <label htmlFor="search" className="icon icon-1202" rel="tooltip" title="search"></label>
              </div> 
 )
}
4

1 回答 1

0

我正在查看“这个”是什么......所以我想通了

    this.props.setFilter(e.target.value) 

为我工作。

于 2017-05-30T11:31:08.430 回答