我的JSLink脚本将无法工作

Question

我正在尝试使用JSLink ..finally..我遇到了一些麻烦，我似乎不能解决。对于我的第一次冒险，我选择了一些非常简单的东西来作为概念的证明。因此，我查阅了一个教程，并想出了一个简单的脚本，在每个条目的标题字段周围绘制一个框并设置文本样式。我不能让它工作。你能帮我看一下这段代码吗？我在JSLink框中使用了以下标记。

~sitecollection/site/folder/folder/file.js

和

~站点/文件夹/文件夹/file.js

与我尝试修改的列表视图WebPart存储在同一站点上的.js文件。该列表只有默认的“标题”列。

(function () {
            var overrideContext = {};
            overrideContext.Templates = {};
            overrideContext.Templates.Item = overrideTemplate;

            SPClientTemplates.TemplateManager.RegisterTemplateOverrides(overrideContext);
}) ();

function overrideTemplate(ctx) {
            return “<div style=’font-size:40px;border:solid 3px black;margin-bottom:6px;padding:4px;width:200px;’>” + ctx.CurrentItem.Title + “</div>”;
}

Answer 1

看起来您似乎正在尝试覆盖上下文(ctx)项本身，而实际上您只想覆盖列表字段和显示该字段的列表视图。讲得通?

首先，将overrideContext.Templates.Item修改为overrideContext.Templates.Fields：

(function () {
            var overrideContext = {};
            overrideContext.Templates = {};
            overrideContext.Templates.Fields = {
            // Add field and point it to your rendering function
            "Title": { "View": overrideTemplate },
            };  
  SPClientTemplates.TemplateManager.RegisterTemplateOverrides(overrideContext);
        }) ();

然后，当JSLink运行时，渲染器在列表视图中查找Title字段，并应用overrideTemplate函数。

function overrideTemplate(ctx) {
            return “<div style=’font-size:40px;border:solid 3px black;margin-bottom:6px;padding:4px;width:200px;’>” + ctx.CurrentItem.Title + “</div>”;
}

就在SharePoint页面上运行多个JSLinks而言，很有可能运行多个JSLink脚本，它们只需要用竖线'|‘符号分隔即可。我经常使用SharePoint Online，我看到下面的格式一直在工作(对不起萨沙！)。

~site/yourassetfolder/yourfilename.js | ~site/yourassetfolder/anotherfilename.js

您可以同时运行任意多个脚本，只需用管道分隔它们即可。我在prem上也看到了这一点，但是你可能想把‘~ site’换成'~sitecollection‘，并确保你访问的js文件在网站集中的顶级网站！

我注意到，当在一个列表或页面上运行多个JSLinks时，因为它们都在进行客户端渲染，太多会减慢页面的速度。如果发生这种情况，您可能需要考虑将它们组合到一个JSLink脚本中，以便服务器只需调用一个文件返回给客户端，即可执行列表所需的所有呈现。

希望这能有所帮助。