v1 docs   See v2 ↗

Vue.js

Setup

To use mod with Vue.js, add the mod’s tag and call like any other element:

<div id="example">
<div id="anymod-amkmr"></div>
</div>
new Vue({
el: '#demo'
})

Inside a custom Vue component

To use mods inside a custom Vue component, call Anymod.render() once Vue has mounted:

<div id="example">
<my-component></my-component>
</div>
// register
Vue.component('my-component', {
template: '<div id="anymod-amkmr"></div>'
})
// create a root instance
new Vue({
el: '#example',
mounted: function () {
Anymod.render()
}
})

Example

Rendering multiple mods

You can render multiple mods the same way as a single mod, like so:

<div id="demo">
<div id=anymod-mldrn></div>
<div id=anymod-eoako></div>
<div id=anymod-amkmr></div>
</div>
new Vue({
el: '#demo',
mounted: function () {
Anymod.render()
}
})

Re-rendering

You can call Anymod.render() as often as you’d like in your Vue.js application (or elsewhere). This method will not lead to an API call every time; if a mod has already been fetched once, Anymod.render() will use that data instead of making another API call.

See the section on Anymod.render for more.