Monaca Onsen UI Discord Chat Github Repo

ListItem OnClick react is not working



  • Hi,

    I’m developing an application based on React using Onsen UI. I tried to list of data using ListItem in which if I click an item on the list it will go to other page. But, the problem is I always get error message <function name> is not a function. My code is as follows :

    constructor(props) {
        super(props);
        this.onGetData2X = this.onGetData2X.bind(this);
    }
    
    onGetData2X(id) {
         this.props.navigator.pushPage({component: JobDetail, props: {orderid : id,navigator: this.props.navigator}});
    }
    
    
    renderRow(row, index) {    
      return (
         <ListItem tappable key={index} onClick={()=>this.onGetData2X(row.id)}>
                <div className='center'>
                    <span class="list-item__title">{row.ordercode}</span>
                </div>
            </ListItem>
        );
    }
    
    render() {
        return (
              <Page>
                 <List
                          dataSource={this.state.rows}
                          renderRow={this.renderRow}
                          renderHeader={() => <ListHeader>Click to view 
                              details</ListHeader>}
                />
            </Page>
        );
    }
    

    Is onClick in ListItem correct ?

    Thanks