我的JSLink脚本不起作用

Question

我试图使用JSLink ..finally ..，但遇到了一些麻烦，似乎无法理顺。 对于我第一次进入兔子洞的冒险，我选择了一些超级简单的东西来用作概念证明。 因此，我查找了一个教程，并想出了一个简单的脚本来在每个条目的“标题”字段周围绘制一个框并设置文本样式。 我无法使它正常工作。 您是否有机会为我查看此代码？ 我在JSLink框中使用了以下标记。

〜sitecollection /网站/文件夹/文件夹/ file.js

和

〜网站/文件夹/文件夹/ file.js

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

(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运行时，渲染器在“列表”视图中查找“标题”字段，并应用您的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页面上运行多个JSLink而言，很有可能运行多个JSLink脚本，只需将它们用管道'|'分隔即可。 符号。 我经常使用SharePoint Online，并且看到以下格式始终有效（对不起，Sascha！）。

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

您可以根据需要同时运行任意多个脚本，只需将它们与管道分开即可。 我也在prem上看到了这一点，但是您可能希望将“〜sites”换成“〜sitecollection”，并确保要访问的js文件在网站集中的顶级网站上！

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

希望这可以帮助。