Uso de lodash en todas las plantillas de componentes de vue

Esta pregunta se puede tratar de diversas maneras, pero en este caso te enseñamos la que para nosotros es la resolución más completa.

Solución:

Algunas de las respuestas actuales pueden funcionar en su escenario, pero tienen desventajas:

• Agregando a la window objeto significa que su proyecto Vue no se puede renderizar en el servidor, porque los servidores no tienen acceso a la window objeto.
• La importación en cada archivo funciona bien, pero puede ser una molestia si tiene que recordar hacerlo en cada archivo.

Un enfoque alternativo es agregar su biblioteca al prototipo de Vue. Todos los componentes se heredan de esto, por lo que ahora todos podrán acceder a su biblioteca desde el this palabra clave.

import _ from 'lodash';    
Object.defineProperty(Vue.prototype, '$_',  value: _ );

Ahora lodash está disponible como método de instancia para todos los componentes. En un archivo .vue puede hacer esto sin importar nada:

export default 
  created() 
    console.log(this.$_.isEmpty(null));
  

La ventaja de usar Object.defineProperty en lugar de una asignación de propiedad normal es que puede definir un descriptor que le permita hacer que la propiedad sea de solo lectura, que será de forma predeterminada. Esto evita que los componentes que consumen lo sobrescriban.

Esto se explica más a fondo en esta publicación de blog (que escribí).

Nota: La desventaja de este enfoque es que obtienes toda la biblioteca de Lodash, incluso si solo necesitas una o dos funciones. Si eso es un problema, mejor usar import reduce, whatever from "lodash"; en la parte superior del archivo que lo requiere.

Podrías importar el lodash en cada componente:

Para plantillas en línea separadas del código del módulo js, ​​debería funcionar con:

  Vue.component('some-tag', 
    computed: 
      _() 
        return _;
      
    
  );

Y luego puedes usarlo en la plantilla en “nativo” manera – _.isEmpty(value).

Si aceptas, puedes dejar un tutorial acerca de qué te ha impresionado de este post.

---

---

Utiliza Nuestro Buscador