sqlite React Native自定义类不设置属性

ff29svar  于 2023-04-21  发布在  SQLite
关注(0)|答案(4)|浏览(116)

我创建了一个名为UserInfo的类,在其中我将用户信息存储在变量中,并在不同的屏幕中调用这些变量

class UserInfo {
    constructor(props) {
        this.username = "Test"
    }
}

export default (new UserInfo())

我在其他屏幕上调用它,像这样UserInfo.username,它工作正常
但是现在我想从本地数据库中获取用户信息,所以我在UserInfo类中创建了一个方法来从本地数据库中获取数据

class UserInfo {
    constructor(props) {
        this.username = ""
        this.getUserInfo
    }

    getUserInfo = () =>{
        db.transaction((tx) => {
            tx.executeSql('SELECT * FROM users', [], (tx, results) => {
                let row = results.rows.item(0);
                console.log("UserID: " + row.id) // return value from db, working
                this.username = row.id
            });
        });
    }

}

export default (new UserInfo())

但是现在它返回空值,但在控制台的值是显示,我错过了什么。我通过调用getUserInfo方法在构造函数的末尾重新设置用户名值...

blpfk2vs

blpfk2vs1#

db.transaction是一个asynchronous调用,在执行this.username = row.id语句之前可能会调用UserInfo.username。不要直接访问username,而是调用UserInfo.getUserInfo()并使用promise获取解析值,如

UserInfo.getUserInfo().then(username => {
    /* do whatever you want to do with username */
});

您需要在getUserInfo中执行的更改如下

getUserInfo = () => {
  return new Promise((resove, reject) => {
     db.transaction((tx) => {
        tx.executeSql('SELECT * FROM users', [], (tx, results) => {
            let row = results.rows.item(0);
            console.log("UserID: " + row.id) // return value from db, working
            this.username = row.id;

            resolve(this.username);

        }, (ts, err) => { 
            /* handle the failed case here */
            reject();
        });
    });
  }); 
}

希望这会有帮助!

ybzsozfc

ybzsozfc2#

我想你可能失去了“这个”的范围
你能试试下面的方法,看看是否有效吗?

class UserInfo {
  constructor(props) {
    this.username = ""
    this.getUserInfo()
  }

  getUserInfo = () => {
    let ref = this; // save a reference to to this
    db.transaction((tx) => {
      tx.executeSql('SELECT * FROM users', [], (tx, results) => {
        let row = results.rows.item(0);
        console.log("UserID: " + row.id) // return value from db, working
        ref.username = row.id // save the username using the reference
      });
    });
  }

}

export default (new UserInfo())
up9lanfz

up9lanfz3#

你正在创建你的类UserInfo的一个新示例,并且在那个时候,存储在this username变量中的空字符串。如果你想在调用getUserInfo函数后从数据库中获取值,那么你可以从你的函数中返回值,并在你的react组件中使用该值,如下所示:-

class UserInfo {
    constructor(props) {
        this.username = ""
        this.getUserInfo
    }

    getUserInfo = () =>{
        return new Promise((resolve, reject) => { 
           db.transaction((tx) => {
             tx.executeSql('SELECT * FROM users', [], (tx, results) => {
                let row = results.rows.item(0);
                console.log("UserID: " + row.id) // return value from db, working
                // this.username = row.id
                resolve(row.id);
            });
           });
        })
    }
 }

export default (new UserInfo())

从函数中返回值后,您可以在react组件中使用此值,如下所示:

UserInfo.getUserInfo().then(username => {
     this.setState({username})
});

将此值存储在状态和组件中,您可以如下所示使用它:

<Text>{this.state.username}</Text>
fhity93d

fhity93d4#

你可以只保存App.js和地铁再次重新加载R它...这对我来说是有效的。基本上,我认为我们必须专注于 Package 这样的问题。

相关问题