Định dạng cột JSON kiểu di chuột

Question

Tôi đang tạo định dạng tùy chỉnh cho cột Tiêu đề của thư viện tài liệu để người dùng luôn tải xuống tài liệu thay vì mở trực tiếp.

Nó hoạt động tốt, nhưng tôi không thể tìm ra một chi tiết kiểu dáng: Tôi muốn liên kết gạch dưới khi di chuột.

như vậy trong giả định dạng mã: style:hover{ text-decoration: underline; }. Bản thân liên kết đã được tạo kiểu như hình dưới đây

{
  "$schema": "http://columnformatting.sharepointpnp.com/columnFormattingSchema.json",
  "elmType": "a",
  "txtContent": "@currentField",
  "style": {
    "color": "#272727",
    "text-decoration": "none",
    "font-size": "14px"
  },
  "attributes": {
    "target": "_blank",
    "href": {
      "operator": "+",
      "operands": [
        "http://tenant.sharepoint.com/sitename/_layouts/download.aspx?SourceUrl=http://tenant.sharepoint.com/sitename/Library/",
        "@currentField"
      ]
    }
  }
}

Answer 1

Tôi đã yêu cầu các kiểu di chuột trong một thời gian dài. Thật không may, như Michael Han_MSFT đã viết trong câu trả lời của mình, điều tốt nhất bạn có thể nhận được là các --hoverlớp học.

May mắn thay, bạn có thể thỏa sức sáng tạo với chúng để đạt được điều mình muốn. Hãy thử định dạng này:

{
  "$schema": "http://columnformatting.sharepointpnp.com/columnFormattingSchema.json",
  "elmType": "div",
  "children": [
    {
      "elmType": "a",
      "txtContent": "@currentField",
      "style": {
        "color": "#272727",
        "text-decoration": "none",
        "font-size": "14px",
        "display": "inline-block",
        "border-bottom-width": "1px",
        "border-bottom-style": "solid"
      },
      "attributes": {
        "target": "_blank",
        "class": "ms-borderColor-white ms-borderColor-themePrimary--hover",
        "href": {
          "operator": "+",
          "operands": [
            "http://tenant.sharepoint.com/sitename/_layouts/download.aspx?SourceUrl=http://tenant.sharepoint.com/sitename/Library/",
            "@currentField"
          ]
        }
      }
    }
  ]
}

Đây là hoạt động:

Answer 2

Bạn có thể sử dụng ms-bgColor-<color>--hoverđể thay đổi kiểu di chuột.

{
  "$schema": "http://columnformatting.sharepointpnp.com/columnFormattingSchema.json",
  "elmType": "a",
  "txtContent": "@currentField",

  "style": {
    "color": "#272727",
    "text-decoration": "none",
    "font-size": "14px"
  },
  "attributes": {
    "target": "_blank",
    "class": "ms-bgColor-red--hover",
    "href": {
      "operator": "+",
      "operands": [
        "http://tenant.sharepoint.com/sitename/_layouts/download.aspx?SourceUrl=http://tenant.sharepoint.com/sitename/Library/",
        "@currentField"
      ]
    }
  }
}