現代化自定製 - 列表和庫部分

Justin-Liu發表於2018-05-14

部落格地址:http://blog.csdn.net/FoxDave
在現代化網站時一個重要方面就是要去了解在網站上使用的自定製都有哪些,因為不是所有已存在的自定製還能正常工作。一個我們常常會遇到的典型例子就是網站中的用來展示一些如法律宣告等公司資訊的橫幅展示。
這一般會通過在頁面中嵌入JavaScript程式碼來實現使用者自定義操作,這種內容將不會顯示在現代化頁面上。繞個彎解決這個問題,我們可以將展示條通過SharePoint Framework應用自定義擴充套件來實現並部署到租戶或網站上。
本文主要介紹一些對於列表和庫的現代化使用者介面不相容的自定義並概要闡述如何修復它們。

列表和庫中的自定義

這部分我們主要專注於列表和庫的自定義,當SharePoint檢測到某個列表或庫具有不相容的自定義內容的時候,它會自動退回到經典使用者介面。因此如果我們想獲得完全的現代化使用者介面,就需要解決這些自定義設定。

JSLink
SharePoint中一個非常普遍的控制欄位如何展示的模型就是使用JSLink。基本上,JSLink允許我們插入JavaScript指令碼去渲染欄位。在現代化使用者介面中,類似的自定製可以在列表檢視頁面實現,編輯頁暫不支援。
如果我們想要替換JSLink,我們可以考慮兩個選項,哪個更好取決於現有解決方案的複雜程度:

  • 如果只是關於如何顯示資料,用欄位格式化通常是最好的選擇。
  • 如果需要更多操作,使用SharePoint Framework欄位自定製擴充套件通常是最好的選擇。

使用欄位格式化
我們可以使用欄位格式化來自定製欄位在SharePoint列表和庫中如何顯示。我們需要構建一個JSON物件來描述如何展示欄位。格式化並不改變資料而只更改資料的邏輯顯示樣式。具有建立和管理列表檢視許可權的使用者都可以使用它。
例如,一個有標題、工作量、指派給和狀態欄位的列表,並沒有自定製,看起來是如下圖的樣子:
這裡寫圖片描述
而通過欄位格式化給工作量、指派給和狀態欄位加了自定製之後看起來可能是下圖的樣子:
這裡寫圖片描述
之後我們會再具體介紹它的用法。

使用SharePoint Framework欄位自定製擴充套件
SharePoint Framework擴充套件使我們能夠通過使用熟悉的SharePoint Framework客戶端開發工具和庫,在現代化頁面和列表庫擴充套件使用者體驗。具體來說,欄位自定製使我們能夠完全控制欄位資料要如何在我們的列表或庫中展示。下圖使一個例子:
這裡寫圖片描述
同樣地,之後也會進行更具體的介紹。

列表範圍的使用者自定義操作(新增自定義選單或者嵌入JavaScript)
使用列表範圍內的使用者自定義操作如新增自定義選單選項到列表的ribbon選單或上下文選單,或嵌入JavaScript是傳統意義上常見的自定製模式,但是對於現代化列表和庫來說並不可用了。幸運的是,使用SharePoint Framework擴充套件我們可以實現類似的自定製,特別是通過命令集擴充套件可以讓我們新增自定義的上下文選單項或自定義按鈕到列表和庫上。我們可以關聯任意的JavaScript或TypeScript指令碼到這些命令。
這裡寫圖片描述
後續會進行更具體的介紹。

相關文章