在 PouchDB 中显示预填充的数据库时遇到问题答案

【问题标题】：Having trouble displaying prepopulated DB in PouchDB在 PouchDB 中显示预填充的数据库时遇到问题
【发布时间】：2014-12-31 07:09:16
【问题描述】：

我才刚刚开始学习 PouchDB。在对文档进行了几次审核并查看了许多示例之后，我根据自己的需要调整了 app.js，这只是为了预填充数据库并显示所有记录（是的，我知道这不是正确的 PouchDB 术语 - 抱歉）。此时，屏幕保持空白，Chrome 开发工具控制台中没有显示任何输出。

你能告诉我代码在什么时候失败了吗？

app.js：

(function() {
'use strict';
// Create new DB 
var tl = document.getElementById('todo-list');
var db = new PouchDB('todos');
return console.log("Created DB");

// Insert data into DB (post docs with auto-IDs)
db.bulkDocs([
{
  title: 'Dog',
  name: 'German Shepherd'
},
{
  title: 'Dog',
  name: 'Don\'s Rotweiler'
},
{
  title: 'Cat',
  name: 'Carrie\'s Siamese'
},
{
  title: 'Cat',
  name: 'Persian'
}
], function(err, response) { 
    if (!err) {
        return console.log('Rows: ' + response.total_rows);
    }
    if (err) {
    return console.error(err);
    }
});

// Redraw screen on change
db.changes({
  since: 'now',
  live: true
}).on('change', showTodos);

function showTodos(){
db.allDocs({include_docs: true}, function(err, response){
    if(!err) {
        tl.innerHTML = "";
        todo.rows.forEach(function(todo){
            tl.innerHTML += '<hr><p>' + todo.title + '<br>' + todo.name + '</p>';
        return console.log(response);
        });
    } if(err) {
        return console.error(err);
    }
});
}
PouchDB.debug.enable('*');
});

【问题讨论】：

标签： pouchdb

【解决方案1】：

我想你的意思是response.rows，而不是todo.rows。此外，每个待办事项都有一个doc，所以在其中，你需要例如todo.doc.title，不是todo.title。

【讨论】：

不，仍然没有通过这些更改创建和显示数据库。控制台也没有错误。

【解决方案2】：

这行得通：

<script type="text/javascript">
    /*
    Purpose: to populate dynamically
    */
    PouchDB.destroy('kittens').then(function() {
        return new PouchDB('kittens');
    }).then(function(db) {

        db.bulkDocs([{
                _id: 'mittens',
                occupation: 'kitten',
                cuteness: 9.0
            }, {
                _id: 'katie',
                occupation: 'kitten',
                cuteness: 8.0
            }, {
                _id: 'felix',
                occupation: 'kitten',
                cuteness: 7.0
            }, {
                _id: 'abby',
                occupation: 'kitten',
                cuteness: 6.0
            }
// line 45: must give id of db docs + 1

        ]).then(function() {
            return db.allDocs({
                include_docs: true
            });
        }).then(function(result) {
            var out = '';
            var i = 0;
            result.rows.forEach(function() {
                while (i < 5) {
                    out = JSON.stringify(result.rows[i].doc) + '<br>';
                    document.getElementById('display').innerHTML += out;
                    i++;
                }
            });

        }).catch(function(err) {
            console.log(err);
        });

    });
</script>
    </head>

<body>
  <pre id="display"></pre>
</body>

【讨论】：