Redactor Vue.js Component
Vue-redactor helps Redactor to work as a Vue.js component. The Redactor Vue component is under MIT license. However, to use this component, you should purchase a Redactor license.
Please see the buying page and License Agreement.
Compatibility
- Vue.js 2.x
Intialization
One Way Binding
Import
import '/your-redactor-dist-path/redactor.min.js';
import './vue-redactor.js';
Component
<div id="app">
<Redactor v-model="content" :config="configOptions"></Redactor>
{{ content }}
</div>
App
new Vue({
el: '#app',
data() {
return {
content: '<h1>Hello and welcome</h1>',
configOptions: {}
}
}
});
Two Way Binding
Import
import '/your-redactor-dist-path/redactor.min.js';
import './vue-redactor.js';
Component
<div id="app">
<Redactor v-model="content" :config="configOptions"></Redactor>
<textarea v-model="content"></textarea>
</div>
App
new Vue({
el: '#app',
data() {
return {
content: '<h1>Hello and welcome</h1>',
configOptions: {}
}
}
});
Call with options
new Vue({
el: '#app',
data() {
return {
content: '<h1>Hello and welcome</h1>',
configOptions: {
plugins: ['table']
}
}
}
});