Question

我是本机反应的全新手，我正在尝试学习它。我想从SQLite获取结果并将它们弹出到数组中，然后可以在平面列表中使用它来显示..这是我的代码：

    //imports

import React,{Component} from 'react';
import {View,Text,FlatList} from 'react-native';



//create component

var SQLite = require('react-native-sqlite-storage')
var db=SQLite.openDatabase({name: 'test.db', createFromLocation: '~sqliteexample.db'})

class DbTask extends Component {


    constructor(props){
        super(props)

        this.state={
            data: []

        };

        db.transaction((tx)=>{

            tx.executeSql('Select * from `pet`',[],(tx,results)=>{

               var len=results.rows.length;
                for(let i=0; i<len; i++){
                 var row=results.rows.item(i);
                 this.state.data.push(row.owner);

                 }


            });

        });

    };


    render(){

        return(
        <View>

           <FlatList data={this.state.data} 
           renderItems={
            ({item})=> <Text>{item.owner}</Text>

           }
           > </FlatList>
        </View>
        );

     }

}


export default DbTask;

我试图在For循环中添加一些警报，它向我显示了所有者的正确名称。但是我不明白，我无法将它们推入“数据”数组，或者我的平面列表不起作用。

任何帮助将不胜感激。提前致谢。问候。

Answer 1

P.S：我做了一些修改，除了问题出在我的平面列表上。像下面这样修改了Flat-List，它就像一个魅力：

<FlatList 
    data={this.state.data} 
    keyExtractor={((item, index) => "itemNo-" + index)}
    renderItem={({item}) => (
        <View style={{flex:1 , flexDirection:'row',justifyContent:'flex-start',marginBottom:10}}>
            <View style={{paddingLeft:20,width:60}}>
            <Text>{item.Number}</Text>
            </View>
            <View style={{paddingLeft:40,width:120}}>
            <Text>{item.Owner}</Text>
            </View>
            <View style={{paddingLeft:50,width:150}}>
            <Text>{item.PetName}</Text>
            </View>
        </View>
    )
  }
/>

如何从react-native中的Array中的sqlite弹出结果？

1 个答案: