注册方法函数
可以在作用域内注册方法,通过向其传递一个 String
名称和一个 Function
到作用域的 add()
方法。注册后,该方法将在作用域实例的 methods
对象上可用。这使得该方法可以在作用域外部被调用,同时保持其在作用域内的执行上下文。
scope.add('methodName', methodFunction); // Register the method
scope.methods.methodName(); // Execute the method
方法参数
名称 | 类型 |
---|---|
...args | 任意 |
注册方法函数代码示例
import { utils, animate, createScope } from 'animejs';
const scope = createScope({
mediaQueries: { isSmall: '(max-width: 200px)' },
})
.add(self => {
/* Registering the method inside the scope allows access to the scope itself */
self.add('onClick', (e) => {
const { clientX, clientY } = e;
const { isSmall } = self.matches;
animate('.square', {
rotate: isSmall ? '+=360' : 0,
x: isSmall ? 0 : clientX - (window.innerWidth / 2),
y: isSmall ? 0 : clientY - (window.innerHeight / 2),
duration: isSmall ? 750 : 400,
});
});
utils.set(document.body, {
cursor: self.matches.isSmall ? 'alias' : 'crosshair'
});
});
/* Methods can be called outside the scope */
document.addEventListener('click', scope.methods.onClick);
<div class="iframe-content resizable">
<div class="large centered row">
<div class="col">
<div class="square"></div>
</div>
</div>
</div>