Question

我有一个脚本，可以提取结果并将其显示在我的网站上。我只想显示正在提取的最后三个结果，而不是所有内容。因此，最新结果是Test2，Test1，然后是Office 365计划服务。

以下是所有结果：

这是我的JavaScript代码：

$(document).ready(function(){
    $pnp.setup({
        baseUrl: "https://fh126cloud.sharepoint.com/TrainingResourceCenter/O365Training"
    });

    $pnp.sp.web.lists.getByTitle("O365RoadMap").items.orderBy("Created", false).get().then(function(items) {
        console.log(items);
        var result = items.map(item => {
            return {
                Title: item.Title,
                Description: item.Description,
                Link: item.Link
            }
        });
        var $table = roadMapDisplay(result);
        console.log($table);
        $('#title').html($table);
    });

    function roadMapDisplay(items) {

        var table = $('<container/>');

        items.forEach(item => {
            table.append(`<a href="${item.Link}" target="_blank" style="font-size: larger;">${item.Title}</a>`);
            table.append(`<div style="text-indent: 10px">${item.Description.slice(0, -200)}...</div>`);
            table.append('<br/>');
        });
        return table;
    }
});

我如何在该函数上循环？我尝试了许多不同的方法，但都不够用。

谢谢大家！

Answer 1

以下内容特定于数组。但是，似乎有一个$pnp-specific answer，在我看来应该更有效。

假设您当前的代码有效（显示完整列表），您可以像这样在items中仅抓取 first 三个条目：

items = items.slice(0, 3);

...或 last 这三个：

items = items.slice(-3);

Answer 2

要保留两个数组：

var items = [1,2,3,4,5,6]
var n = 3
var remainingArray = items.splice(0, items.length-n);

console.log(remainingArray)//<--first n elements
 
console.log(items)//<--last n elements

Answer 3

我猜$ pnp是基于在线快速搜索的，带有jQuery In SharePoint的PnP JavaScript库。

我对PnP不太了解。但是，我在https://github.com/SharePoint/PnP-JS-Core/wiki/Working-With:-Items中注意到了该文档：

//使用odata运算符进行更有效的查询

$ pnp.sp.web.lists.getByTitle（“我的列表”）.items.select（“标题”，“描述”）.top（5）.orderBy（“ Modified”，true）.get（） .then（（items：any []）=> {       console.log（items）;   }）;

您可以看到他们正在使用“ top（5）”；因此，您可以更改顺序，以便首先获取最后一个元素，然后使用top（3）获取要显示的那三个记录。

由于$ pnp似乎遵循链式模式，所以我想知道是否可以在获得top（3）之后再次应用order方法。

Answer 4

我认为您正在寻找这个。如果我们的查询始终返回前三项，那为什么我们要显式使用javascript？

$pnp.sp.web.lists.getByTitle("O365RoadMap").items.top(3).orderBy("Created", false).get().then(function(items) {
console.log(items);
});

您可以从here那里获得更多知识

Answer 5

通过使用slice属性更新此部分来获得三个最新结果。现在可以正常工作。

items.slice(0, 3).forEach(item => {

使用JavaScript循环仅显示最新的3个结果

5 个答案: