2017-04-04 84 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} 

      /> 
      ); 
    } 

基本上,加入一键追踪的独特的项目在我的名单是什么救了我。希望这为未来提供了其他人的帮助。