haixing-hu / vue-html-editor Goto Github PK
View Code? Open in Web Editor NEWA Vue.js component implementing the HTML editor with the jQuery summernote plugin.
Home Page: http://haixing-hu.github.io/vue-html-editor/
License: MIT License
A Vue.js component implementing the HTML editor with the jQuery summernote plugin.
Home Page: http://haixing-hu.github.io/vue-html-editor/
License: MIT License
I am not able to use toolbar property:
<vue-html-editor model="{{@ body}}" toolbar="[font, [bold, italic, underline]]"></vue-html-editor>
If I give any value to tolbar , all the available sommernote buttons appear in the view.
Hi there,
I use vuejs-webpack-template with your package but can't seem to get it to work....
The message i get: $(...).summernote is not a function
Any ideas?
I create a pull request #17 to fix this issue.
please check it.
Hi
I installed this at my nuxt project but it show this error
[Vue warn]: Failed to mount component: template or render function not defined.
VueHTMLEditor(
id="content"
name="html-editor"
:model.sync="content"
)
import VueHTMLEditor from 'vue-html-editor'
export default {
components: {
VueHTMLEditor
},
Can you help me?
Thank you in advance
Hi
Trying this component I get the following error:
Attribute ":model.sync" is ignored on component <vue-html-editor> because the component is a fragment instance
I'm using Vue 1.0.26.
What am I doing wrong?
Thanks!
Martin
So according to my experiences installing this package, as well as the interactive documentation (http://browsenpm.org/package.json) about the file, the main field should not be in an array, which causes any require('vue-html-editor') call to fail.
I want to how to integrate to Laravel5.3?
Good, day, awesome people!
I am really new to vuejs world!
I need your hints in integrating this awesome pakage in my inline-template.
app.js
require('./components/kiosk/emails.js'); // This is Emails inline template component!
This is my vuejs inline component emails.js
Vue.component('forex-kiosk-emails', {
data: function() {
return {
form: new Form({
date: moment.utc().format("YYYY-MM-DD"),
message:'',
comment:'We will try better exit later if it will be Possible',
}),
}
},
mounted() {
// axios.get('/api/signals').then(response => this.signals = response.data);
// axios.get('/api/signals/' + 3 + '/edit').then(response => this.signal = response.data);
},
methods: {
onSubmit: function () {
this.form.submit('post', '/api/emails/send-morning-signals');
},
},
computed: {
validation: function() {
return {
message: !!this.form.message.trim(),
}
},
isValid: function () {
var validation = this.validation
return Object.keys(validation).every(function (key) {
return validation[key]
})
}
},
});
This is my html. emails.blade.php
<forex-kiosk-emails inline-template>
<div class="panel panel-default">
<div class="panel-heading">View and edit instrument forms
<button class="pull-right btn btn-xs btn-default" type="submit" data-toggle="modal" data-target="#createform">Add new form</button>
</div>
<div class="panel-body">
<form action="#" @submit.prevent="onSubmit" v-on:keyup="form.errors.clear($event.target.name)" >
<div class="form-group">
<label for="message">Paste signals email</label>
<textarea v-model="form.message" rows="8" type="text" class="form-control" placeholder="Entry form" contenteditable></textarea>
<div class="form-text text-danger" v-text="form.errors.get('message')"></div>
<div v-show="!validation.message" class="form-text text-danger">Please enter data</div>
</div>
<button :disabled="!isValid" class="btn btn-primary pull-right" type="submit">Send morning email signals</button>
</form>
</div>
@{{ form.message }}
</div>
</forex-kiosk-emails>
Where do I put this code? So I can use it in my emails inline template?
var Vue = require("vue");
var vm = new Vue({
el: "#app",
components: {
"vue-html-editor": require("vue-html-editor")
},
data: {
text: "Hello World!"
}
});
Thank you very mutch! Any help would be appreciated!
I am using react rich text editor with react. I have used this editor in an application. While typing in mobile the keypad get closed automatically. After typing first word on every line I am getting this issue. How to rectify from this issue?
I get a requirement conflict when trying to install as a bower asset. It seems I need an old jQuery version instead of the current 3.2.x version. Can this be fixed?
composer require bower-asset/vue-html-editor
"bower-asset/vue-html-editor v0.2.1 requires bower-asset/jquery >=2.2.4,<3.0.0 -> satisfiable by bower-asset/jquery[2.2.4] but these conflict with your requirements or minimum-stability"
Demo application for vue-html-editor breakdown. There is an error relating to uncaught ReferenceError: $ is not defined
Is it possible to make the vue-html-editor compatible to the famous vue-validator plugin? The vue-validator plugin works through adding directives on the input fields. But those directives are not applied/passed through with vue-html-editor.
Just added everything as per instructions (installed summernote), getting this error:
Failed to mount component: template or render function not defined.
found in
---> <VueHtmlEditor>
Is vue-html-editor
compatible with Vue.js 2.0? I'm using Vue.js 2.0 and I'm getting the following error:
[Vue warn]: Failed to mount component: template or render function not defined. (found in component )
import vueeditor from 'vue-html-editor' , components: {check , mlist , loading , vueeditor} , npm install vue-html-editor
But the error : Module not found: Error: Cannot resolve module 'vue-html-editor'
I'm using Vue.js 1.0.16 and summernote 0.7.3.
This happens once when typing the first letter in summernote textarea.
The model is not updating as well.
Any ideas why this is happening? I'm doing exactly as in the example
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.