Nanoscale Parts Manufacturing

    vue-sanitize

    0.2.2 • Public • Published

    vue-sanitize

    Whitelist-based HTML sanitizer (sanitize-html) for Vue.js apps.

    Software License Packagist Latest Version Issues

    Note

    We should always sanitize user input values on the server. Do sanitize with Vue only for necessary cases (e.g markdown preview).

    Install

    npm install --save vue-sanitize
    

    or

    yarn add vue-sanitize
    

    Usage

    Register the plugin

    import VueSanitize from "vue-sanitize";
    Vue.use(VueSanitize);

    You can pass default options too:

    defaultOptions = {
        allowedTags: ['a', 'b'],
        allowedAttributes: {
          'a': [ 'href' ]
        }
    };
    Vue.use(VueSanitize, defaultOptions);

    Use it in your components:

    <template>
      <div contenteditable="true" @paste="sanitize"></div>
    </template>
    
    <script>
    export default {
      methods: {
        sanitize(event) {
          event.preventDefault();
          const html = this.$sanitize(event.clipboardData.getData('text/html'));
          //or
          //const html = this.$sanitize(
          //  event.clipboardData.getData('text/html'),
          //  {
          //    allowedTags: ['b', 'br']
          //  }
          //);
          document.execCommand('insertHTML', false, (html));
        }
      },
    }
    </script>

    API

    Vue.use(VueSanitize[, defaultOptions])

    options

    • Type: Object

    This plugin is dependent on sanitize-html. For details, see here https://github.com/punkave/sanitize-html#readme.

    this.$sanitize(diarty[, options])

    diarty

    • Type: String
    • Required: true

    options

    • Type: Object

    If you don't pass an options, the default options will be used.

    VueSanitize.defaults

    Return sanitizeHtml.defaults.

    Change log

    Please see CHANGELOG for more information what has changed recently.

    Security

    If you discover any security related issues, please email daichirata@gmail.com instead of using the issue tracker.

    Contributing

    1. Fork it!
    2. Create your feature branch: git checkout -b my-new-feature
    3. Commit your changes: git commit -am 'Add some feature'
    4. Push to the branch: git push origin my-new-feature
    5. Submit a pull request :D

    License

    The MIT License (MIT). Please see License File for more information.

    Install

    npm i vue-sanitize

    DownloadsWeekly Downloads

    14,198

    Version

    0.2.2

    License

    MIT

    Unpacked Size

    838 kB

    Total Files

    9

    Last publish

    Collaborators

    • daichirata