Question

我试图在这里做一些简单的事情 - 连接到sqlite数据库并返回记录数。在下面的代码中，我可以使用console.log输出len变量，但不会返回任何内容。我错过了一些明显的东西吗感谢。

const db = SQLite.openDatabase({ name: 'favorites.db' });
export default class PlayerScreen extends React.Component {

   fetch(){
      console.log('fetching data from database');
       var query = "SELECT * FROM items";
       var params = [];
         db.transaction((tx) => {
            tx.executeSql(query,params, (tx, results) => {
            var len = results.rows.length;
            return len;

          }, function(){
            console.log('Profile: Something went wrong');
          });
      });

}

render() {

   return  <Text>{this.fetch()}</Text>

}
 }

Answer 1

这里有很多错误。 Fetch是一个异步概念，React渲染是同步的。你不能在render方法中异步使用fetch或任何东西。

那么，你该怎么做呢？

首先，在组件的componentDidMount中进行提取。还在componentWillMount

中设置初始状态

componentWillMount() {
  this.state = { length: 0 };
}

componentDidMount() {
  // I use call here to make sure this.fetch gets the this context
  this.fetch.call(this);
}

其次，将结果附加到fetch方法

中组件的innerState

fetch() {
  var query = "SELECT * FROM items";
   var params = [];
     db.transaction((tx) => {
        tx.executeSql(query,params, (tx, results) => {
        var len = results.rows.length;

        // this.setState will trigger a re-render of the component
        this.setState({ length: len }); 

      }, function(){
        console.log('Profile: Something went wrong');
      });
  });
}

现在，在render方法中，您可以使用this.state.length来呈现值。

render() {
  return  <Text>{this.state.length}</Text>
}

希望这可以帮助你

React native函数不返回任何内容

1 个答案: