He creado una función para rotar un elemento div. Esto funciona bien como un código independiente en HTML y cuando traté de incorporar en mi proyecto la función de rotación arroja un error como "Error de tipo no detectado: this.rotate no es una función". Mi proyecto se basa en la versión 8 del nodo y he convertido HTML a Pug y lo he usado. He dado mi código a continuación:
var rotation = 0; $.fn.rotate = function(degrees) { $(this).css({'-webkit-transform' : 'rotate('+ degrees +'deg)', '-moz-transform' : 'rotate('+ degrees +'deg)', '-ms-transform' : 'rotate('+ degrees +'deg)', 'transform' : 'rotate('+ degrees +'deg)'}); }; $('.box').click(function() { rotation += 5; this.rotate(rotation); });Debe usar funciones de flecha o vincular la función a 'esto'
var rotation = 0; $.fn.rotate =(degrees) => { $(this).css({'-webkit-transform' : 'rotate('+ degrees +'deg)', '-moz-transform' : 'rotate('+ degrees +'deg)', '-ms-transform' : 'rotate('+ degrees +'deg)', 'transform' : 'rotate('+ degrees +'deg)'}); }; $('.box').click(() => { rotation += 5; this.rotate(rotation); });El manejo de esto también es diferente en las funciones de flecha en comparación con las funciones regulares.
En resumen, con las funciones de flecha no hay vinculación de esto.
En las funciones regulares, la palabra clave this representaba el objeto que llamó a la función, que podría ser la ventana, el documento, un botón o lo que sea.
Con las funciones de flecha, esta palabra clave siempre representa el objeto que definió la función de flecha.
https://www.w3schools.com/js/js_arrow_function.asp
¡Buena suerte!