我的 JSLink 脚本不工作

My JSLink script will not work

我正在尝试使用 JSLink ..终于..但我遇到了一些似乎无法解决的问题。对于我的第一次冒险,我选择了一些超级简单的东西作为概念证明。所以我查阅了一个教程并想出了一个简单的脚本来在每个条目的标题字段周围绘制一个框并设置文本样式。我无法让它工作。您有机会帮我看一下这段代码吗?我在 JSLink 框中使用了以下标记。

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

~site/folder/folder/file.js

.js 文件存储在与我试图修改的列表视图 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>”;
}

您似乎在尝试覆盖上下文 (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 运行s 渲染器在列表视图中查找标题字段,并应用您的 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 文件位于站点 collection 如果你这样做!

我注意到当 运行在列表或页面上设置多个 JSLink 时,因为它们都在进行客户端呈现,太多会减慢您的页面速度。如果发生这种情况,您可能需要考虑将它们合并到一个 JSLink 脚本中,这样服务器只需调用一个文件即可 return 到客户端来完成您的列表所需的所有渲染。

希望对您有所帮助。