Have ideas to improve npm?Join in the discussion! »

    vue-autofocus-directive

    1.0.4 • Public • Published

    vue-autofocus-directive

    Autofocus directive for Vue

    About

    Lifted from the official Vue tutorial: https://vuejs.org/v2/guide/custom-directive.html

    When the page loads, the element with the directive gains focus (note: autofocus doesn’t work on mobile Safari).

    Installation

    npm install --save vue-autofocus-directive

    npm package link

    Usage

    import Vue from "vue";
    import autofocus from "vue-autofocus-directive";
    Vue.directive("autofocus", autofocus);
    <input v-autofocus />

    Options

    binding

    • Type: value
    • Default: undefined
    • Description: Required when using dynamic value

    Example

    <template>
      <form>
        <label>Email</label>
        <input
          v-autofocus
          v-model="email"
          type="email"
          name="email"
          placeholder="Email"
        />
      </form>
    </template>

    or

    <template>
      <form>
        <label>Email</label>
        <input
          v-autofocus="dynamicValue"
          v-model="email"
          type="email"
          name="email"
          placeholder="Email"
        />
      </form>
    </template>
     
    <script>
    export default {
      data() {
        return {
          dynamicValue: false
        };
      }
    };
    </script>

    Keywords

    Install

    npm i vue-autofocus-directive

    DownloadsWeekly Downloads

    1,321

    Version

    1.0.4

    License

    MIT

    Unpacked Size

    6.3 kB

    Total Files

    7

    Last publish

    Collaborators

    • avatar