Estilo de desplazamiento de formato de columna JSON

Aug 21 2020

Estoy creando un formato personalizado para la columna Título de una biblioteca de documentos para que los usuarios siempre descarguen los documentos en lugar de abrirlos directamente.

Está saliendo bien, pero no puedo imaginar un detalle de estilo: quiero que el enlace se subraye cuando se coloca el cursor.

por lo que en seudo código de formato: style:hover{ text-decoration: underline; }. El enlace en sí ya tiene el estilo que se muestra a continuación

{
  "$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"
      ]
    }
  }
}

Respuestas

2 theChrisKent Aug 21 2020 at 14:34

He estado pidiendo estilos de desplazamiento durante mucho tiempo. Desafortunadamente, como escribió Michael Han_MSFT en su respuesta, lo mejor que puede obtener son las --hoverclases.

Afortunadamente, puede ser creativo con ellos para lograr lo que desea. Prueba este formato:

{
  "$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"
          ]
        }
      }
    }
  ]
}

Aquí está en acción:

MichaelHan_MSFT Aug 21 2020 at 09:33

Puede utilizar ms-bgColor-<color>--hoverpara cambiar el estilo de desplazamiento.

{
  "$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"
      ]
    }
  }
}