使用字段格式化来自定义SharePoint(四)

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/FoxDave/article/details/82019602

博客地址:http://blog.csdn.net/FoxDave

创建可点击的操作

我们可以使用字段格式化来提供访问其他页面的超链接,或执行自定义的功能。这种功能被限制为静态链接,可以使用列表中字段的值进行参数化。除了http://、https://或mailto:,我们无法使用字段格式化去输出链接协议。

将字段值转换为超链接(基础)
本例展示了如何将包含股票行情符号的文本字段转换为指向雅虎财经对股票行情实时引用的超链接。例子中使用了+操作符,将当前字段的值附加到静态超链接http://finance.yahoo.com/quote/。我们可以将这种方式扩展到想要用户查看列表项相关上下文信息或在当前列表项上启动业务流程等的任意场景。
这里写图片描述

{
   "$schema": "https://developer.microsoft.com/json-schemas/sp/column-formatting.schema.json",
   "elmType": "a",
   "txtContent": "@currentField",
   "attributes": {
      "target": "_blank",
      "href": "='http://finance.yahoo.com/quote/' + @currentField"
   }
}

向字段添加操作按钮(高级)
下图展示了添加到字段中的操作按钮。
这里写图片描述
我们可以使用字段格式化去渲染字段旁的快速操作链接。下面的用户字段的例子将会在父级DIV元素中生成以下两个元素:

  • SPAN元素,包含用户字段的显示名。
  • A元素,它会打开一个mailto的链接,创建一个带有标题和内容的电子邮件界面并弹出,通过列表项的元数据为其赋值。A元素使用ms-Icon、ms-Icon-Mail和ms-QuickAction这三个Fabric类进行样式定义,使它看起来像是一个可以点击的电子邮件图表。
{
    "$schema": "https://developer.microsoft.com/json-schemas/sp/column-formatting.schema.json",
    "elmType": "div",
    "children": [
        {
            "elmType": "span",
            "style": {
                "padding-right": "8px"
            },
            "txtContent": "@currentField.title"
        },
        {
            "elmType": "a",
            "attributes": {
                "iconName": "Mail",
                "class": "sp-field-quickAction",
                "href": {
                    "operator": "+",
                    "operands": [
                        "mailto:",
                        "@currentField.email",
                        "?subject=Task status&body=Hey, how is your task coming along?.\r\n---\r\n",
                        "@currentField.title",
                        "\r\nClick this link for more info. http://contoso.sharepoint.com/sites/ConferencePrep/Tasks/Prep/DispForm.aspx?ID=",
                        "[$ID]"
                    ]
                }
            }
        }
    ]
}

猜你喜欢

转载自blog.csdn.net/FoxDave/article/details/82019602