Question

在/视图中，我从mongodb获取文档，并为每个仅显示日期和前几个单词的文档创建一个列表项。我希望能够单击每个列表项以转到新页面/view，以查看该特定文档的其余部分。

为此，我相信我需要在item和/之间传递/view，然后在那里访问item的属性。如何使用pagelist功能（或没有它）执行此操作？

index.js：

var express = require('express');
var exphbs = require('express-handlebars');
var bodyParser = require('body-parser'); 
var app = express();
var hbs = exphbs.create({
  helpers: {
    message: function() {return 'Welcome!';},
    doc: function() {return "Something went wrong.";}
  }
});
app.engine('handlebars', hbs.engine);
app.set('view engine', 'handlebars');
app.use(bodyParser.urlencoded({ extended: true }));
app.use(bodyParser.json()); 

const MongoClient = require('mongodb').MongoClient;
var assert = require('assert');  
var util=require('util');
const url = 'mongodb://localhost:27017/users';
const dbName = 'users';
var db;  
MongoClient.connect(url, function(err, client) {
 assert.equal(null, err);
  console.log("Connected successfully to server");
  db = client.db(dbName);
  db.collection("reviewYelp2", { }, function(err, coll) {
        if (err != null) {
          console.log(err)
          db.createCollection("reviewYelp2", function(err, result) {
                assert.equal(null, err);  
      });
    }

    db.ensureIndex("reviewYelp2", { document: "text"}, function(err, indexname) {
        assert.equal(null, err);
    });

  });
});

app.get("/", function(req, res) { 
    res.render('search');
});

app.get("/view", function(req, res) {
    // NEED TO BE ABLE TO ACCESS CLICKED ITEM HERE 
    res.render('viewItem', {
        // Change to access item.text when I have access to item
        helpers: {
            doc: function() {return "Viewing doc...";}
        }
    });
});

app.post("/", function(req, res) {  
    db.collection('reviewYelp2').find({
        text: new RegExp(req.body.query)
    }).sort({date: 1}).toArray(function(err, items) {
        res.render('search', {
        helpers: {
            message: function() {return pagelist(items);}
        }
    });
  })
});

function pagelist(items) {  
    result = "<ul>";
    items.forEach(function(item) {
        // Grab only first 10 words of text
        textSlice = item.text.split(" ");
        textSlice = textSlice.slice(0, 5);
        text = textSlice.join(" ");
        str = "<li class="+item._id+"><a href='/view'>" + item.date + "    " + text + "...</a></li>";
        result = result + str;
    });
    result = result + "</ul>";
    return result;
}

app.listen(3000, function() {
    console.log("App listening on localhost:3000");
});

search.handlebars：

<!DOCTYPE html>
<html>
<body>
  <form method="post">
   <input type="text" size="80" name="query" />
   <input type="submit" value="Search" class="submitButton" />
   {{{ message }}}
</form>
</body>
</html>

viewItem.handlebars：

<!DOCTYPE html>
<html>
<body>
    <button onclick="window.history.back()">Go back to list</button>
   {{{ doc }}}
</body>
</html>

Answer 1

这是有问题的，因为http基本上是无状态的 - 即每个对服务器的请求都是它自己的事情。您可以提出涉及cookie或本地存储的方案，但我认为更简单的方法更好，更常见。

一个更简单的想法是拥有一个带有某种id参数的路由：

require(knitr)
require(kableExtra)
kable(mtcars, "html") %>%
  kable_styling(bootstrap_options = c("striped", "hover"))

现在，在索引上，您可以看到如下链接列表：

app.get("/view_detail/:itemID", function(req, res) {
    var item = req.params.itemID 
    // lookup detail about item based on itemID
    res.render('viewItem', {
        // send data
    });
});

将现有数据传递到不同视图

1 个答案: