0

我在 webpart 的加载时间（15 秒）方面面临一些挑战。我从列表中提取数据并将其绑定到 ajax 中的下拉控件，但由于涉及异步调用，它有一些等待时间。

我需要更好的性能如何实现这一点。任何人都可以提供见解。

function getPackingSites()
{
var packagingSiteUrl = siteAbsUrl + "/_api/web/lists/GetByTitle('"+packingSiteList+"')/Items";
var packagingSiteOptions ="";
$.ajax({
url:packagingSiteUrl,
method: "Get",
async: false,
headers: {
"accept": "application/json;odata=verbose",
},
success: function (PackingSiteData) {
if (PackingSiteData.d.results.length > 0) {
for (var i = 0; i < PackingSiteData.d.results.length; i++) {
packagingSiteOptions += "<option value='"+PackingSiteData.d.results[i].ID+"'>"+PackingSiteData.d.results[i].Title+"</option>";
}
}
},
error: function (x, e) {
alert(e.message.tostring());
}
});
$("#PackingSiteDropdwn").html(packagingSiteOptions);

var tempLink = '<a id="newformSubmit" class="btn offset" href="'+siteAbsUrl+'/pages/Create.aspx?PackSiteID='+$("#PackingSiteDropdwn").val()+'&Source='+siteAbsUrl+'">Submit</a>';
$("#newformSubmitSpan").html(tempLink);
}

}
4

2 回答 2

0

您正在使用同步调用来呈现您的 Web 部件，这将增加 Web 部件的加载时间。

我建议您使用异步数据刷新，您可以轻松地使用 React 框架。

第一次加载webpart时，向用户显示“数据加载”等提示信息，当异步调用数据返回时，显示实际数据。

return (      
      <div className={ styles.fileViewCounter }>
        default content
        <div className={ styles.container }>
          <div className={ styles.row }>
            <div className={ styles.column }>              
              <table className="tree">
                <thead>
                    <tr>
                        <th className={styles.THWidth}>Folder/File</th>
                        <th >Views</th>
                        <th >Viewers</th>
                    </tr>
                </thead>                
                { this.state.FileViewResult
                    ? <tbody dangerouslySetInnerHTML={{ __html: this.state.FileViewResult}}></tbody>
                    : <tr><td align={"center"} colSpan={3}>Data Loading...</td></tr>
                 }                
            </table>          
            </div>
          </div>
        </div>
      </div>
    )

您可以查看github 示例或我的演示项目以进行异步数据刷新。

于 2020-03-04T03:33:40.093 回答
0

从搜索中获取项目是否适合您？

于 2020-03-04T21:19:55.823 回答