Neural Processing Mechanisms

    vue-textarea-grow
    TypeScript icon, indicating that this package has built-in type declarations

    1.0.5 • Public • Published

    Vue 2 textarea autogrow

    Very simple Vue directive for handling textarea autogrow (automatically adjustable height).

    There is no need any custom component registration or CSS out-of-the-box.

    If you want to set a min-height to textarea, you should use the native rows textarea attribute.

    It works with Nuxt.js nicely too. Please run only on client-side.

    Installation

    npm install vue-textarea-grow
    

    Examples

    Local registration

    import { grow } from 'vue-textarea-grow';
    
    export default {
    
      directives: {
        grow,
      },
    
    };

    Global registration

    import { grow } from 'vue-textarea-grow';
    
    Vue.directive(
      'grow',
      grow,
    );

    Template

    <textarea
      v-grow
    ></textarea>

    Conditional usage

    When you need to use this directive conditionally, you can do this.

    So it is not necessary to add extra textarea element:

    <template>
      <div>
        <textarea
          v-if="grow"
        ></textarea>
    
        <textarea
          v-else
        ></textarea>
    
        <button
          @click="grow = false"
        ></button>
    </div>
    </template>
    
    <script>
    export default {
    
      data() {
        return {
          grow: true,
        };
      },
    
    };
    </script>

    Instead:

    <template>
      <div>
        <textarea
          v-grow="grow"
        ></textarea>
    
        <button
          @click="grow = false"
        ></button>
      </div>
    </template>
    
    <script>
    export default {
    
      data() {
        return {
          grow: true,
        };
      },
    
    };
    </script>

    Install

    npm i vue-textarea-grow

    DownloadsWeekly Downloads

    45

    Version

    1.0.5

    License

    MIT

    Unpacked Size

    9.19 kB

    Total Files

    15

    Last publish

    Collaborators

    • nevadavid