0

Estoy intentando deshabilitar un NavLink como este:

<NavLink class="nav-link" href="NovaDedicacio" >
    <span class="oi oi-list-rich" aria-hidden="true"></span> Imputar dedicació propia
</NavLink>

Pero el control no me ofrece la opción Enable/Disable/IsDisabled/... ni nada parececido. Opciones que ofrece el control NavLink

Debo usar el NavLink si o si. ¿Alguien tiene alguna idea de como puedo hacerlo?

Muchas gracias

Enlaces relacionados con el control: https://blazor-university.com/routing/navigating-our-app-via-html/

3
  • ¿Por que no usas css? puedes hacerlo con blazor, con una etiqueta html o añadiendo una clase directamente Commented el 3 mar. 2021 a las 10:42
  • @NicolasOñate Lo he pensado, pero ¿Se podrá seguir clicando no? Necesito que se inhabilite totalmente sin que desaparezca
    – LaGafas
    Commented el 3 mar. 2021 a las 10:45
  • 1
    tal vez con disabled puedas lograrlo Commented el 3 mar. 2021 a las 11:01

2 respuestas 2

1

NavLink es un componente y no tiene propiedad "disabled" pero siendo un componente lo que hace es recoger todos los atributos adicionales que desconoce y luego los coloca en el tag.

El codigo fuente de esta clase/componente podeis encontrar en el siguiente enlace oficial en github:

NavLink.cs

Como podeis observar en la linea 35 y 36:

    [Parameter(CaptureUnmatchedValues = true)]
    public IReadOnlyDictionary<string, object>? AdditionalAttributes { get; set; }

Tenemos la recogida de todos los atirbutos adicionales (Unmatched) los que se añaden al componente en el momento de renderización en la fila 166:

builder.AddMultipleAttributes(1, AdditionalAttributes);

Con esta esta captura de atributos podemos utilizar el atributo "disabled='true'" como si fuera un control HTML normal. Despues en CSS podeis crear estilos especiales a los NavLink que tengan este atributo con valor "true" y "false".

-1

Nicolas Oñate me dió la solución. Añadí este style a mi conjunto de css:

.isDisabled {
  color: currentColor;
  cursor: not-allowed;
  opacity: 0.5;
  text-decoration: none;
}

Y lo añadí a mi NavLink:

<NavLink class="nav-link isDisabled" href="NovaDedicacio" >

Muchas gracias Nicolas, espero que mi respuesta pueda ayudar a alguien.

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.