Skip to content

vue-append, like v-html directive, but it can call javascript function.

License

Notifications You must be signed in to change notification settings

hacke2/vue-append

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

41 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

vue-append

vue-append, like v-html directive, but it can call javascript function

Install

npm install vue-append --save
# or
yarn add vue-append

Es6 module

  • Available through npm as vue-append.
  import VueAppend from 'vue-append'
  Vue.use(VueAppend)

CommonJS

  var VueAppend = require('vue-append')
  Vue.use(VueAppend)

Direct include

  • You can also directly include it with a <script> tag. It will automatically install itself, and will add a global VueAppend.

Event

appended

  • if html append , script downloaded and no throw error, it will fire appended event.

appenderr

  • if throw error when html appended, it will fire appenderr event.

Usage

Using the v-append directive

template:

<div id="app">
    <div v-append="html" @appended="appended"></div>
</div>
<div id="app">
    <div v-append.sync="html" @appended="appended"></div>
</div>

js:

import Vue from 'vue/dist/vue.esm'
import VueAppend from 'vue-append'

// use the plugin
Vue.use(VueAppend);

const html = `
<div id="test">1</div>
<script
  src="https://code.jquery.com/jquery-3.4.1.min.js"
  integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
  crossorigin="anonymous"></script>
<script>
var i = 1;
setInterval(function() {
    document.getElementById("test").innerHTML = ++i;
}, 1000);
</script>

`;

new Vue({
  el: '#app',
  data: {
    html: html
  },
  methods: {
    appended() {
      console.log('appended!');
      // could use jQuery 😊
      alert(window.jQuery);
    }
  }
});

See /example for a timer demo. To build it, run npm install && npm run build.

License

MIT

About

vue-append, like v-html directive, but it can call javascript function.

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published