注册方法函数

通过将 String 名称和 Function 传递给 Scope 的 add() 方法，可以在 Scope 中注册一个方法。注册后，该方法将在 Scope 实例的 methods 对象上可用。这允许从 Scope 外部调用该方法，同时保持其在 Scope 内的执行上下文。

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>

上一个 下一个