有时候浏览器中没有显示数据 [英] Sometimes data isn't being displayed in browser

查看：115
本文介绍了有时候浏览器中没有显示数据的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

当我点击 ctr + r 有时整个数据不会显示。在我的（/）页面上，我有一个左边和右边。左侧应显示所有数据，右侧应显示随机数据。它大部分时间工作，但如果我点击键盘上的 ctr + r 来刷新，有些或全部数据不会出现。



这是我的代码如何工作。




  • 将 comps 集合设置为 arr的数据（现在我有3个电文3个文件）。

  • 事实上，它会从集合中删除所有内容，所以每次我去/ 我只得到3个文档（用于测试）

  • 找到所有带过滤器的文档并显示在左侧（我可以显示它们，因为find方法返回文档），然后我使用doc

  • 使用findOne（）来获取随机的。



另外你应该注意，我的代码中有console.log（），并且控制正确的信息。我在控制台中收到所有3个文件。说实话，在渲染时我从来没有使用过多个模型，而在模型方法中我从不使用随机的方法。所以我可能搞砸了。



我想知道为什么有时刷新时数据不会出现。



server.js 

  var express = require（express），
 app = express（） 
 mongoose = require（mongoose），
 ejs = require（ejs）; 
 mongoose.connect（mongodb：// localhost / comp1）; 
 var port = process.env.PORT || 3000; 
 app.set（view engine，ejs）; 
 app.use（express.static（./ public））; 
 
 var Comp = require（./ models / company.js）; 
 
 app.get（/，function（req，res）{
 var arr = [
 {name：comp1，行业：industry1 20}，
 {name：comp2，行业：industry2，排名：5}，
 {name：comp3，行业：industry3，排名：10} 
 ] 
 Comp.count（{}，function（err，count）{
 var random = Math.floor（Math.random（）* count）; 
 Comp.find（{}） $ {$} 
}）
 Comp.create（arr，function（err，docs）{
 console .log（docs）
 console.log（count）
}）
 
 Comp.find（{}，'name -_id ranking'，{sort：{等级：1 }}，function（err，doc）{
 if（err）throw err; 
 Comp.findOne（）。skip（random）.exec（function（err，result）{
 res .render（index，{data：doc，count：random，result：result}）
}）
 
}）
}）
 
}）
 
 
 
 
 app.listen（port，function（）{
 console.log（node is listening on port：+ port）; 
}）

index.ejs 

 <！DOCTYPE html> 
< html lang =en> 
< head> 
< meta charset =UTF-8> 
< title> index< / title> 
< link rel =stylesheethref =/ style.css> 
< / head> 
< body> 
 ontop 
< div class =container clearfix> 
< div class =leftSide> TEST 
<％= data％> 
<％data.forEach（function（comp）{％> 
< div><％= comp.name％>< span> ranking：<％= comp.ranking ％>< / span>< / div> 
<％}）; ％GT; 
< / div> 
< div class =rightSide> side<％= count％> 
< div><％= result％>< / div> 
< / div> 
< / div> 
 
< / body> 
< / html>

company.ejs 

  var mongoose = require（mongoose）; 
 var Schema = mongoose.Schema; 
 
 var compSchema = new Schema（{
 name：String，
 industry：String，
 ranking：Number，
 created_at：Date，
 updated_at：Date，
 inc：Number 
 
}）; 
 
 compSchema.pre（save，function（next）{
 var currentDate = new Date（）; 
 this.updated_at = currentDate; 
 var counter = 0; 
 this.inc = counter; 
 counter ++; 
 
 if（！this.created_at）{
 this.created_at = currentDate; 
} 
 next（）; 
}）
 
 var Comp = mongoose.model（Comp，compSchema）; 
 
 module.exports = Comp;


解决方案

最简单但 NOT推荐做你想要的方式是下面的代码，但通常会导致回调地狱或厄运金字塔，并且难以阅读，因此不要使用这个 !!!! 

  Comp.count（{}，function（err，count）{
 Comp.find（{}）。remove（{}，function（）{
 Comp.create（arr，function（err，docs）{
 Comp.find（{}，...， function（err，doc）{
 Comp.findOne（）。skip（random）.exec（function（err，result）{
 res.render（index，{}）
 }）
}）
}）
}）
}）

另一种方法可能是使用 async.js 

  async.series（[ 
 function（callback）{
 Comp.count（{}，function（err，count）{
 callback（null，count）; 
 }}; 
}，
 function（callback）{
 Comp.find（{}）remove（{}，function（）{
 callback（null） 
}）; 
}，
函数（回调）{
 Comp.create（arr，function（err，docs）{
 callback（null）; 
}）; 
}，
函数（回调）{
 Comp.find（{}，...，function（err，doc）{
 callback（null）; 
 }）; 
}，
 function（callback）{
 Comp.findOne（）。skip（random）.exec（function（err，lastResult）{
 callback（null，lastResult）; 
}）; 
} 
]，
 //可选回调，结果是每个回调的结果数组，如果有
函数（err，results）{
 // results is现在等于[count，lastResult] 
 res.render（index，{}）
}）;

，最后Promises 我没有尝试过或使用过，所以不能100％ / em>但是这样的东西

  var promise = Comp.count（{}）exec（）; 
 
 promise.then（function（count）{
 return Comp.find（{}）。remove（{}）exec（）; 
}）
 。（（）; 
}）
 .then（function（）{
返回Comp.find（{}）。remove（{}）。exec（）; 
}）
 .then（function（）{
 return Comp.find（{}）。跳过（随机）.exec（）; 
}）
 .then（function（result）{
 res.render（index，{}）
}）

看看这里有关mongoose承诺的一些更多细节如何使用mongoose Promise - mongo


When i click ctr + r sometimes the whole data doesn't show up. on my ("/") page I have a left side and a right side. The left side should display all of the data and the right side should display a random piece of data. It works most of the time but if I click ctr + r on the keyboard to refresh sometimes some or all the data doesn't appear .

This is how my code works.

  • sets the comps collections to the data from arr (now I have 3 elems. 3 docs).
  • Actually before it does that it deletes all the content from the collection so every time I go to "/" I get only 3 docs (for testing)
  • find all docs with the filters and display them on the left side (I can display them because the find method returns doc) then I use doc in the render.
  • use the findOne() to get the random.

Also you should note that I do have the console.log() in my code and that consoles the correct information. I get all 3 documents in the console.

To be honest I never used more than one method on the model when rendering and I never used a random method in a model method. so I maybe messing that up.

I want to know why sometimes the data doesn't appear when I refresh.

server.js

var express = require("express"),
    app = express(),
    mongoose = require("mongoose"),
    ejs    = require("ejs");
mongoose.connect("mongodb://localhost/comp1");
var port = process.env.PORT || 3000;   
app.set("view engine", "ejs"); 
app.use(express.static("./public"));

var Comp = require("./models/company.js");

app.get("/", function(req, res){
    var arr = [
    {name : "comp1",industry : "industry1", ranking: 20},
    {name : "comp2",industry : "industry2", ranking: 5},
    {name : "comp3",industry : "industry3", ranking: 10}
    ]
 Comp.count({}, function(err, count){
       var random = Math.floor(Math.random() * count);
        Comp.find({}).remove({}, function(){
            console.log("removed")
        })
        Comp.create(arr, function(err, docs){
            console.log(docs)
            console.log(count)
        })

       Comp.find({}, 'name -_id ranking', {sort :{ranking :1}}, function(err, doc){
            if(err) throw err;
            Comp.findOne().skip(random).exec(function(err, result){
                res.render("index",{data : doc , count: random , result : result})
            })

        })
   })

})




app.listen(port, function(){
    console.log("node is listening on port : " + port );
})

index.ejs

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>index</title>
    <link rel="stylesheet" href="/style.css">
</head>
<body>
    ontop
    <div class="container clearfix">
        <div class="leftSide">TEST
            <%= data%>
            <%data.forEach(function(comp){%>
                <div><%= comp.name %> <span>ranking : <%= comp.ranking %></span></div>
            <%  }); %>
        </div>
        <div class="rightSide">side <%= count %>
            <div><%=result %></div>
        </div>
    </div>

</body>
</html>

company.ejs

var mongoose = require("mongoose");
var Schema = mongoose.Schema;

var compSchema = new Schema({
    name : String,
    industry: String,
    ranking : Number,
    created_at : Date,
    updated_at : Date,
    inc : Number

});

compSchema.pre("save", function(next){
    var currentDate = new Date();
    this.updated_at = currentDate;
    var counter = 0;
    this.inc = counter;
    counter++;

    if(!this.created_at){
        this.created_at = currentDate;
    }
    next();
})

var Comp = mongoose.model("Comp", compSchema);

module.exports = Comp;

解决方案

The simplest but NOT RECOMMENDED way to do what you want would be the code bellow but it usually leads to callback hell or Pyramid of doom and its hard to read so don't use this!!!!

Comp.count({}, function(err, count){
   Comp.find({}).remove({}, function(){
      Comp.create(arr, function(err, docs){
         Comp.find({}, ..., function(err, doc){                
            Comp.findOne().skip(random).exec(function(err, result){
                res.render("index",{})
            })    
         }) 
      })
   })    
})

another way could be to use async.js

async.series([
    function(callback){
        Comp.count({}, function(err, count){
            callback(null, count);
        });
    },
    function(callback){
        Comp.find({}).remove({}, function(){
            callback(null);
        });
    },
    function(callback){
        Comp.create(arr, function(err, docs){
            callback(null);
        });
    },
    function(callback){
        Comp.find({}, ..., function(err, doc){ 
            callback(null);
        });
    },
    function(callback){
        Comp.findOne().skip(random).exec(function(err, lastResult){
            callback(null, lastResult);
        });
    }
],
// optional callback, results is an array of results from each callback if any
function(err, results){
    // results is now equal to [count, lastResult]
    res.render("index",{})
});

and finally Promises I haven't tried or used this, so not 100% sure but something like this 

var promise = Comp.count({}).exec();

promise.then(function(count) {
    return Comp.find({}).remove({}).exec();
})
.then(function() {
    return Comp.create(arr, ).remove({}).exec();
})
.then(function() {
    return Comp.find({}).remove({}).exec();
})
.then(function() {
    return Comp.find({}).skip(random).exec();
})
.then(function(result) {
    res.render("index",{})
})

Have a look here for some more details about promises on mongoose How to use mongoose Promise - mongo

这篇关于有时候浏览器中没有显示数据的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！

查看全文
相关文章
前端开发最新文章
热门教程
热门工具
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆