SharePoint Online 為Modern Page添加腳本

　　前言

　　眾所周知，如果我們想向SharePoint 頁面添加腳本，最方便的便是經典頁面，添加方式主要有內容編輯器Web部件或者直接使用SharePoint Designer。

　　但是，如果頁面是Modern 頁面，我們沒辦法向裏面添加腳本，無論是兩種方式都沒辦法做到。當然，除了SharePoint Framework開發的Webpart。

　　正文

　　1.這裡，我們就開發了一個基於SharePoint Framework的WebPart，可以幫助我們向SharePoint Modern頁面添加腳本，來完成一些需求。

　　Tips：WebPart的功能非常簡單，就是向頁面中添加了一個Div元素，ID可以在右側的屬性面板里配置。同時，可以添加一個外部JavaScript文件引用，也是在右側的屬性面板里進行配置。

　　2.一般來說，我們會在這個引入的外部JavaScript文件中添加我們需要的代碼，諸如獲取SharePoint Online列表項目，引入JQuery庫，等等。

　　我這裡也做了一個簡單的例子，就是引用JQuery和SharePoint Plus文件，前者用來操作DOM，後者用來請求數據。

　　Tips：這裏面要說的是loadScript這個方法，是同步添加外部引用其它JS的方法，為的是添加引用以後回調函數，防止異步造成還沒添加完引用，就執行了函數。

　　3.我們可以看一下這個效果，如下圖：

　　1）首先是測試列表的測試數據截圖：

　　2）然後是剛剛進入頁面的效果，會是一個loading的效果，一般會有1秒左右的加載時間，當然也取決於你的腳本的功能和邏輯的複雜度：

　　3）然後是數據加載出來，顯示的效果，如下圖：

　　結束語

　　這個，是霖雨無聊間做的一個小部件，覺得蠻有意思的就分享給大家，有需要的自己可以嘗試一下。