jeanbenitez/stencil-createref

This simple implementation of React.CreateRef in StencilJS app.

Stencil CreateRef

This simple code adds the same functionality as React.CreateRef to StencilJS app.

CreateRef facilitates the association of an HTML element within the component.

Usage

npm i stencil-createref

import { createRef } from 'stencil-createref'

@Component({
    tag: 'my-component',
    styleUrl: 'my-component.css'
})
class MyComponent {
  textInput = createRef<HTMLInputElement>();

  focusTextInput = () => {
    this.textInput.current.focus();
  }

  render() {
    return (
      <div>
        <input
          type="text"
          ref={this.textInput} />

        <input
          type="button"
          value="Focus the text input"
          onClick={this.focusTextInput}
        />
      </div>
    );
  }
}