haixing-hu / vue-html-editor Goto Github PK

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?

• show by v-if and each time new DOM of summernote is created.
• however, created DOMs are not destroyed when hide by v-if.

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

Demo application for vue-html-editor breakdown. There is an error relating to uncaught ReferenceError: $ is not defined

I want to how to integrate to Laravel5.3?

Just added everything as per instructions (installed summernote), getting this error:

Failed to mount component: template or render function not defined.

found in

---> <VueHtmlEditor>

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

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

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.

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?

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!

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.

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 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"

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.

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 )