Zurb, fabricantes de Foundation, tiene una reputación de crear herramientas robustas que los desarrolladores web adoran. Elaboran soluciones efectivas porque comienzan a resolver los problemas que encuentran ellos mismos.
engine called Ahora vuelven con un nuevo motor de código abierto de JavaScript ES6 JavaScript de código abierto llamado Tribute.js .
is a user interface technique for addressing someone directly. @mention es una técnica de interfaz de usuario para dirigirse a alguien directamente. someone, they are tagged into a conversation. Cuando @menciona a alguien, se etiquetan en una conversación. was first popularized by social media sites like Twitter, but you'll find it making its way into all manner of applications thanks to adoption by startups like Slack. La @mention se popularizó por primera vez en los sitios de redes sociales como Twitter, pero encontrará que se abre camino en todo tipo de aplicaciones gracias a la adopción por parte de nuevas empresas como Slack.
Allá por 2014, Zurb comenzó a fusionar varias de sus aplicaciones de diseño en una única plataforma nueva llamada Incapaz . system, but failing to find a reliable 3rd party option, they decided to build their own. Necesitaban un sistema de @mention , pero al no encontrar una opción fiable de terceros, decidieron crear el suyo propio. El resultado es Tribute.js.
Tribute.js es una solución nativa de JavaScript, lo que significa que evita confiar en complementos o scripts de terceros. Al evitar bibliotecas como jQuery, Angular, etc., Zurb disminuyó las posibilidades de conflictos entre Tribute.js y scripts que se ejecutan junto con este; lo que hace que Tribute.js sea una herramienta altamente utilizable que se puede implementar de manera consistente en una multitud de aplicaciones diferentes, independientemente de las otras dependencias que pueda elegir usar.
Tribute.js es realmente simple de implementar. Primero, importe el CSS y JS de Tribute.js:
: A continuación, necesita un elemento en su marcado que mostrará un @mention :
Por último, inicialice Tribute con una matriz de objetos que represente a sus usuarios y luego adjunte Tribute al elemento de la página:
Cuando un usuario escribe un símbolo @, se le presentará una lista de nombres de usuario basados en la propiedad clave , cuando seleccionen uno, se insertará la propiedad del valor correspondiente.
Usted puede descargar Tribute de forma gratuita desde Github, o instalar a través de npm, y encontrará una lista completa de opciones en la documentación.
Imagen destacada, Conversaciones a través de Steve McClanahan .