Question

我正在尝试创建待办事项列表，然后我尝试使用此复选框

反应天然-复选框

我不知道这个问题是否来自该软件包

当我单击复选框并单击删除按钮时，这就是发生的事情

这是我显示列表的代码

    interface TodoProps{
        todo: TodoModel;
        ter:string;
    }
    interface TodoState{
        dataSource: any;
        myTodo: Array<ITodo>;
    }

    const ds = new ListView.DataSource({rowHasChanged: (r1, r2) => true});

    export default class Todo extends React.Component <TodoProps,TodoState>{

        constructor(props:TodoProps) {
            super(props);

            this.state = {
                dataSource: ds.cloneWithRows([]), // or put your initial data here
                myTodo: []
            };
        }

  componentWillReceiveProps = (nextProps) => {
           console.log(this.state.myTodo);
        let data = {
            title: nextProps.ter,
            isChecked: false
        };
        let todoList = this.state.myTodo;

        if (nextProps.ter) {
            todoList.push(data);
        }

        this.setState({
            myTodo: todoList
        });

    }

        onDelete(){
            let todos = this.state.myTodo.filter((todo:ITodo) => {
                 return !todo.isChecked;
             });

            this.setState({
                myTodo: todos
            });
        }

        render() {

            let dataSource = this.state.dataSource.cloneWithRows(this.state.myTodo);
            return (
                <View style={styles.container}>
                    <View style={styles.box2}>
                        <ListView enableEmptySections={true} dataSource={dataSource} renderRow={(rowData, sectionID, rowID) => <TodoList data={rowData} onClick={this.onClick.bind(this)} id={rowID} /> } />
                    </View>
                    <View style={styles.box3}>
                        <TouchableOpacity style={styles.bbox1} onPress={()=> alert('weee')}>
                            <Text style={styles.tabText}>All</Text>
                        </TouchableOpacity>
                        <TouchableOpacity style={styles.bbox2} onPress={()=> alert('weee')}>
                            <Text style={styles.tabText}>Complete</Text>
                        </TouchableOpacity>
                        <TouchableOpacity style={styles.bbox3} onPress={()=> alert('weee')}>
                            <Text style={styles.tabText}>InComplete</Text>
                        </TouchableOpacity>
                        <TouchableOpacity style={styles.bbox4} onPress={()=> this.onDestroy()}>
                            <Text style={styles.tabText}>Delete</Text>
                        </TouchableOpacity>
                    </View>
                </View>
            )
        }
    }

但是如果我控制台记录数据。我发现所有的都是谢克：是假的。只有复选框的视图不起作用。我是否需要使用componentwillamount（）？

Answer 1

使用以下示例代码

 _onRefresh() {
    this.setState({refreshing: true});
    // your callback function or call this.componentDidMount()
  }

  render() {
    return (
      <ListView
        refreshControl={
          <RefreshControl
            refreshing={this.state.refreshing}
            onRefresh={this._onRefresh.bind(this)}
          />
        }
        ...
      >
      ...
      </ListView>
    );
  }

如何在本机中刷新ListView组件？

1 个答案: