2017-04-04 24 views
0

これは重複する可能性がありますが、すべてが正しいと思われます。私の関数はアイテムを削除しますが、間違ったアイテムは削除します。私がconsole.logを使ってオブジェクトの配列を検査すると、選択したアイテムは存在しなくなりました。新しいオブジェクトで、私は状態を設定します。ここに私のコードです:ListViewが間違ったアイテムを削除しています

 export default class MainApp extends Component { 
      constructor(props) { 
      super(props); 

      this.state = { 
       damping: 1 - 0.6, 
       tension: 400, 
       dataBlob: [], 
      dataSource: new ListView.DataSource({rowHasChanged: (r1, r2) => r1 !== r2}), 
      }; 

      } 

     componentDidMount() { 

     fetch('http://54.152.253.14/barbershop/appointmentHelper.php') 
     .then((response) => response.json()) 
     .then((responseData) => { 
      this.state.dataBlob = responseData; 
      this.setState({ 
       dataSource:this.state.dataSource.cloneWithRows(this.state.dataBlob), 
       isLoading: false, 
      }); 
     }) 
     .done(); 
     } 

     deleteItem(rowId){ 
    console.log(rowId); 
    this.state.dataBlob.splice(rowId,1); 
    console.log(this.state.dataBlob); 
    this.setState({ 
    dataSource: this.state.dataSource.cloneWithRows(this.state.dataBlob), 
    }) 
    } 
    fetchData() { 

    } 

    renderList = (dataObj,sectionID,rowId) => { 

    return (
     <View style={styles.container}> 

     <Row damping={this.state.damping} tension={this.state.tension} onPress={()=>this.deleteItem(rowId)}> 
      <View style={styles.rowContent}> 
      <View style={styles.rowIcon} /> 
      <View> 
       <Text style={styles.rowTitle}>{dataObj.service}</Text> 
       <Text style={styles.rowSubtitle}>Drag the row left and right</Text> 
      </View> 
      </View> 
     </Row> 



     </View> 
    ); 
    }; 

    render() { 
    return (
      <ListView 
      dataSource={this.state.dataSource} 
      renderRow={(data, sectionID, rowID) => this.renderList(data, sectionID, rowID)} 
      style={styles.listView} 

      /> 
      ); 
    } 
} 

私は助けていただければ幸いです。私は、リストビューに関するいくつかの概念的なアイデアを見逃していて、本当に私の理解を向上させることを楽しみにしています。ありがとう。これに私のレンダリング機能を変更する

答えて

0

は私の問題を解決:

render() { 
    return (
      <ListView 
      key={this.state.dataBlob} 
      dataSource={this.state.dataSource} 
      renderRow={(data, sectionID, rowID) => this.renderList(data, sectionID, rowID)} 
      style={styles.listView} 

      /> 
      ); 
    } 

は基本的に、私のリストにユニークなアイテムを追跡するためのキーを追加すると、私を救ったものです。うまくいけば、これは将来他の誰かの助けになる。

関連する問題