获取数据库中的数据并设置进度条的建议

如何解决获取数据库中的数据并设置进度条的建议

我已经在数据库中存储了学生 ID 和阅读的书籍数量。现在，我已经实现了获取学生阅读书籍数量的详细信息的方法。但函数 progressbardata() 不返回从查询中获取的数据。我试图在 db.transaction() 中手动分配一个值并返回它但没有运气。

你能告诉我我哪里做错了吗。这种方法也循环多次。我们如何解决这个问题。

import * as Progress from 'react-native-progress';
import { openDatabase } from 'react-native-sqlite-storage';
var db = openDatabase({ name: 'UserDatabase.db' });
let progressbardata = (id) => {
    var totalItems=0;
    db.transaction((tx) => {
      tx.executesql('SELECT * FROM student where id = ?',[id],(tx,results) => {
          totalItems = results.rows.item(0).percent;
          return (totalItems);
      })
    })
}
const _renderContent = (item,index) => {
return (
<View>
   <Progress.Bar color='#68FF33' progress={progressbardata(item.id)}/>
   </View>
)
}

解决方法

我的猜测是获取数据的请求是异步的，并且这段代码似乎不会等待响应继续。因此，当获取请求尚未返回值时，代码将继续。如果是这种情况，我建议您让请求设置组件的状态，并将状态作为 Progress.Bar 组件的输入。这样，当 fetch 请求异步完成时，将设置状态并更新进度条。这看起来像这样：

import * as Progress from 'react-native-progress';
import { openDatabase } from 'react-native-sqlite-storage';
import { useState } from 'react'
var db = openDatabase({ name: 'UserDatabase.db' });

const renderContent = (props) => {

    [progress,setProgress] = useState(0)

    let progressbardata = (id) => {
            var totalItems=0;
            db.transaction((tx) => {
                  tx.executeSql('SELECT * FROM student where id = ?',[id],(tx,results) => {
                  totalItems = results.rows.item(0).percent;
                  setProgress(totalItems);
              })
            })
        }

    progressbardata(props.id)

    return (
    <View>
       <Progress.Bar color='#68FF33' progress={progress}/>
       </View>
    )
}