v-model属性不会显示在内部

时间:2017-07-03 07:29:28

标签: vue.js tinymce

我有v-model属性,我的问题是属性没有在tinymce中显示,即使我可以在inspect元素中看到它。

<label>Nama : @{{ adDetailOrder.gajah }}</label>
<input type="text" name="nama" v-model="adDetailOrder.gajah" style="margin-bottom:0px" class="form-control" v-validate.initial="'required|alpha_spaces'" placeholder="Full Name">

<label>@{{ adDetailOrder.gajah }} ... ...</label>
<textarea id="description" class="form-control" rows="3" name="description">... @{{ adDetailOrder.gajah }} ...
</textarea>

这是我的vue

data: {
            ...

            adDetailOrder: {

                gajah: '',
            }

这是图片

tinymce doesn't show v-model

这是某人是adDetailOrder.gajah

我做错了什么?

提前致谢。

1 个答案:

答案 0 :(得分:-1)

HTML:

<template>
<div class="uk-form-controls">
<textarea id="editor"></textarea>
</div>
<template>

脚本:

var vue = new Vue({
    el: '#app',
    components: {

    },
    data: {        
        description: '',      
    },
    methods: {
      
    },
    computed: {

    },
    watch: {
        description(val) {
            this.description= val
        }
    },     


});

/*TinyMCE Editor */
tinymce.init({
    selector: '#editor',
    twoWay: true,
    height: 300,
    menubar: false,
    branding: false,
    statusbar: false,
    language: 'tr',
    /* */
    setup: function (editor) {
        // init tinymce
        // when typing keyup event
        editor.on('keyup', function () {
            // get new value
            var new_value = tinymce.get('editor').getContent(self.value);
            vue.$data.description= new_value;
        });
    },
    update: function (newVal, oldVal) {
        // set val and trigger event
        $(this.el).val(newVal).trigger('keyup');
    },
    plugins: [
        'advlist autolink lists link image charmap print preview anchor',
        'searchreplace visualblocks code fullscreen',
        'insertdatetime media table paste code help wordcount'
    ],
    toolbar: 'undo redo | formatselect | ' +
        'bold italic backcolor | alignleft aligncenter ' +
        'alignright alignjustify | bullist numlist outdent indent | ' +
        'removeformat | help',
    content_style: 'body { font-family:Helvetica,Arial,sans-serif; font-size:14px }'
});