DOMNode

In order to interact with the DOM node that's automatically generated for your component, Joystick automatically providers the DOMNode value via your component instance. instance.DOMNode can be helpful for referencing or (carefully) manipulating the DOM independent of Joystick's rendering. The DOMNode value can be accessed from anywhere on your component where the instance is available.

import joystick from '@joystick.js/ui';

const Index = joystick.component({
  lifecycle: {
    on_mount: (instance = {}) => {
      const button = instance.DOMNode.querySelector('button');
      // Interact with the DOM node for the button in your component.
    },
  },
  render: () => {
    return `
      <div>
        <button>Click Me</button>
      </div>
    `;
  },
});