title: Delete List Item on right swipe react-native
body: <p>// Here I am trying to delete List item from Flat List .
  Data is populating from JSON on Flat List now I have to delete particular list item  data form list , for that I am using "Swipeout"  . but getting error "Type error: undefined is not an object(evaluting this.2.viewNote.bind")<br>
  Please help . Where am going wrong and how can I do this </p>
  
  <pre><code>import React, { Component } from 'react';
  import { View, Text, TextInput,   
  FooterTab,Button,TouchableOpacity, ScrollView, StyleSheet,
  ActivityIndicator ,Header,FlatList} from 'react-native';
  import {Icon} from 'native-base';
  import { Table, Row, Rows } from 'react-native-table-component';
  import { createStackNavigator } from 'react-navigation';  
  import { SearchBar } from 'react-native-elements';
  import Swipeout from 'react-native-swipeout';
  
  let swipeBtns = [{
      text: 'Delete',
      backgroundColor: 'red',
      underlayColor: 'rgba(0, 0, 0, 1, 0.6)',
      onPress: () =&gt; { this.deleteNote(item) }
  }];
  
  export default class OpenApplianceIssue extends Component {
  
  
    constructor() {
        super();
        this.state = {
            AbcSdata: null,
            loading: true,
            search: '',
            tableData: [], qrData: '', selectedPriority: '',
            selectedIssue: '', selectedReason: '', selectedTriedRestart: '',
            selectedPowerLED: '', selectedBurning: '', selectedNoise: '',
        };
        this.setDate = this.setDate.bind(this);
    }
  
    setDate(newDate) {
    }
  
  
    _loadInitialState = async () =&gt; {
        const { navigation } = this.props;
        const qdata = navigation.getParam('data', 'NA').split(',');
        var len = qdata.length;
        const tData = [];
        console.log(len);
        for(let i=0; i&lt;len; i++)
        {
            var data = qdata[i].split(':');
            const entry = []
            entry.push(`${data[0]}`);
            entry.push(`${data[1]}`);
            tData.push(entry);
        }
        this.setState({tableData: tData } );
  
        console.log(this.state.tableData);
        this.setState({loading: true});
    }
  
    componentDidMount() {
      this._loadInitialState().done(); 
      this.createViewGroup();
    }
  
    createViewGroup = async () =&gt; {
      try {
        const response = await fetch(
          'http:/Dsenze/userapi/sensor/viewsensor',
          {
            method: 'POST',
            headers: {
              Accept: 'application/json',
              'Content-Type': 'application/json',
            },
            body: JSON.stringify({
             "password": 'admin',
              "username": 'admin',
              "startlimit":"0",
              "valuelimit":"10",
            }),
          }
        );
  
        const responseJson = await response.json();
  
        const { sensorData } = responseJson;
  
  
        this.setState({
          AbcSdata: sensorData,
          loading: false,
        });
      } catch (e) {
        console.error(e);
      }
    };
  
  
    updateSearch = search =&gt; {
      this.setState({ search });
    };
    keyExtractor = ({ id }) =&gt; id.toString();
    keyExtractor = ({ inventory }) =&gt; inventory.toString();
  
    renderItem = ({ item }) =&gt; (
  
  
      &lt;Swipeout right={swipeBtns}&gt;
      &lt;TouchableOpacity
        style={styles.item}
        activeOpacity={0.4}
        onPress={this.viewNote.bind(this, item)} &gt;
  
        &lt;Text &gt;Id : {item.id}&lt;/Text&gt;
        &lt;Text&gt;Inventory : {item.inventory}&lt;/Text&gt;
        &lt;Text&gt;SensorType : {item.sensorType}&lt;/Text&gt;
        &lt;Text&gt;TypeName : {item.typeName}&lt;/Text&gt;
      &lt;/TouchableOpacity&gt;
      &lt;/Swipeout&gt;
    );
    viewNote(item) {
      this.props.navigator.push({
        title: 'The Note',
        component: ViewNote,
        passProps: {
          noteText: item,
          noteId: this.noteId(item),
        }
      });
    }
  
  
   onClickListener = (viewId) =&gt; {
      if(viewId == 'tag')
      {
        this.props.navigation.navigate('AddSensors');
      }}
  
      renderSeparator = () =&gt; {
        return (
          &lt;View
            style={{
              height: 1,
              width: "86%",
              backgroundColor: "#CED0CE",
            }}
          /&gt;
        );
      };
  
  
    render() {
      const { loading, AbcSdata } = this.state;
      const state = this.state;
  
      return (
        &lt;ScrollView&gt;
          &lt;View style={styles.container1}&gt;
  
  
              &lt;Button full rounded
                style={{fontSize: 20, color: 'green'}}
                 styleDisabled={{color: 'red'}}
                 onPress={() =&gt; this.onClickListener('tag')}
                    title="Add Sensors"
                    &gt;
                        Add Sensors
                      &lt;/Button&gt;
  
          &lt;/View&gt;
  
          &lt;View style={styles.container1}&gt;
            {this.state.loading ? (
              &lt;ActivityIndicator size="large" /&gt;
  
            ) :
  
            (
              &lt;FlatList 
                data={AbcSdata}
                renderItem={this.renderItem}
               keyExtractor={this.keyExtractor}
               ItemSeparatorComponent={this.renderSeparator}
  
              /&gt;
            )}
          &lt;/View&gt;
  
  
          &lt;View&gt;
            &lt;Text 
            style={{alignSelf: 'center', fontWeight: 'bold', color: 'black'}} &gt;
            Inventory Details
            &lt;/Text&gt;
  
              &lt;Table borderStyle={{borderWidth: 2, borderColor: '#c8e1ff', padding:10,paddingBottom: 10}}&gt;
              &lt;Rows data={state.tableData} textStyle={styles.text}/&gt;
              &lt;/Table&gt;
              &lt;/View&gt;
        &lt;/ScrollView&gt;
      );
    }
  }   
  
  
  
  
  const styles = StyleSheet.create(
      {
          container1:
          {
              flex: 1,
              alignItems: 'stretch',
              fontFamily: "vincHand",
              color: 'blue'
          },
          header_footer_style:{
  
            width: '100%', 
            height: 44, 
            backgroundColor: '#4169E1', 
            alignItems: 'center', 
            justifyContent: 'center',
            color:'#ffffff',
  
  
          },
          Progressbar:{
              justifyContent: 'center',
              alignItems: 'center',
              color: 'blue',
  
          },
          ListContainer :{
              borderColor: '#48BBEC',
              backgroundColor: '#000000',
              color:'red',
              alignSelf: 'stretch' ,
          },
  
          container2:
          {
              flex: 1,
              justifyContent: 'center',
              alignItems: 'stretch',
              paddingHorizontal: 15
          },
  
          inputBox:{
              width:300,
              borderColor: '#48BBEC',
              backgroundColor: '#F8F8FF',
              borderRadius:25,
              paddingHorizontal:16,
              fontSize:16,
              color:'#000000',
              marginVertical:10, 
  
          },
          button:{
              width:300,
              backgroundColor:'#4169E1',
              borderRadius:25,
              marginVertical:10,
              paddingVertical:16
          },
  
          buttonText:{
          fontSize:16,
          fontWeight:'500',
          color:'#ffffff',
          textAlign:'center'
  
          },
          textStyle:{
            fontSize:16,
          fontWeight:'500',
          color:'#ffffff',
          textAlign:'center'
  
          },
  
          item:
          {
              padding: 15
          },
  
          text:
          {
              fontSize: 18
          },
          button:{
              width:300,
              backgroundColor:'#4169E1',
              borderRadius:25,
              marginVertical:10,
              paddingVertical:16
          },
          buttonText:{
              fontSize:16,
              fontWeight:'500',
              color:'red',
              textAlign:'center'
  
              },
          separator:
          {
              height: 2,
              backgroundColor: 'rgba(0,0,0,0.5)'
          },
          container: { flex: 1, padding: 16, paddingTop: 30, backgroundColor: '#fff' },
          head: { height: 40, backgroundColor: '#f1f8ff' },
          text: { margin: 6 }
      });
  
  Thanks .
  </code></pre>