现代化自定制 - 列表和库部分

简介:

博客地址: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脚本到这些命令。
这里写图片描述
后续会进行更具体的介绍。

相关文章
|
6月前
|
编解码 前端开发 JavaScript
构建高效响应式Web界面:现代前端框架的比较
【4月更文挑战第9天】在移动设备和多样屏幕尺寸盛行的时代,构建能够适应不同视口的响应式Web界面变得至关重要。本文深入探讨了几种流行的前端框架——Bootstrap、Foundation和Tailwind CSS,分析它们在创建响应式设计中的优势与局限。通过对比这些框架的栅格系统、组件库和定制化能力,开发者可以更好地理解如何选择合适的工具来优化前端开发流程,并最终实现高性能、跨平台兼容的用户界面。
414 15
|
移动开发 JavaScript 小程序
扩展应用功能的无限可能——UniApp生态系统中的组件库探索(一)(下)
扩展应用功能的无限可能——UniApp生态系统中的组件库探索(一)
|
3月前
|
存储 算法 数据处理
|
3月前
|
前端开发
项目中如何使用组件化
【8月更文挑战第13天】项目中如何使用组件化
44 2
|
5月前
|
JavaScript 前端开发 API
【vue实战项目】通用管理系统:学生列表
【vue实战项目】通用管理系统:学生列表
74 2
|
5月前
|
存储 算法 数据处理
掌握Python列表:灵活存储、便捷操作,轻松处理各类数据
掌握Python列表:灵活存储、便捷操作,轻松处理各类数据
|
6月前
|
编解码 前端开发 JavaScript
构建高效响应式Web界面:现代前端开发的最佳实践
【2月更文挑战第18天】 在多设备浏览的时代,创建一个既高效又具有适应性的响应式Web界面已成为前端开发者的核心任务。本文将深入探讨实现流畅响应式体验的关键策略,包括灵活的布局设计、图像优化技巧以及性能考量。通过实例分析和技术深度剖析,我们将揭示如何利用HTML5、CSS3和JavaScript的最新特性,为不同尺寸的设备提供无缝的用户体验。文章不仅聚焦于代码实现,还将讨论开发流程中的协作与测试最佳实践,旨在为前端开发人员提供一个全面的指南,帮助他们在构建响应式Web界面时做出明智的技术选择。
159 4
|
6月前
|
前端开发 JavaScript 数据可视化
使用JavaScript实现复杂功能:动态数据可视化的构建
使用JavaScript实现复杂功能:动态数据可视化的构建
|
开发框架 JavaScript 小程序
扩展应用功能的无限可能——UniApp生态系统中的组件库与插件探索
扩展应用功能的无限可能——UniApp生态系统中的组件库与插件探索
|
机器学习/深度学习 人工智能 数据挖掘
使用Python的Web框架构建现代化应用程序
现代化的应用程序开发已经成为了软件工程领域的热门话题。随着互联网和移动技术的迅速发展,构建高性能、可扩展和易于维护的应用程序变得越来越重要。而Python作为一种强大而灵活的编程语言,在现代Web开发中扮演了重要的角色。
204 0