Question

我正在尝试制作一个简单的论坛模块，并且需要一个简单的WYSIWYG库，所以我选择了summernote.js。我正在使用Symfony 4.2.7（最新版本）和Webpack Encore来跟踪我的js和css文件。

我能够像这样加载我的Summernote库：

bootstrap.js

import Vue from 'vue';
import BootstrapVue from 'bootstrap-vue';
import axios from 'axios';
import Swal from 'sweetalert2';

window.Vue = Vue;
Vue.use(BootstrapVue);

// Modules
window.axios = axios;
window.axios.defaults.headers.common = {
    'X-Requested-With': 'XMLHttpRequest'
};

window.Swal = Swal;

// Summernote
$('.editable-area').summernote({
    toolbar: [
        // [groupName, [list of button]]
        ['style', ['bold', 'italic', 'underline']],
        ['font', ['strikethrough', 'superscript', 'subscript']],
        ['fontsize', ['fontsize']],
        ['color', ['color']],
        ['para', ['ul', 'ol', 'paragraph']],
        ['height', ['height']]
    ],
    placeholder: '',
    minHeight: 250,
    maxHeight: 1000,
    height: 300,
});

app.js

// Bootstrap
import './bootstrap';

// Styles
import 'bootstrap/dist/css/bootstrap.css';
import 'bootstrap-vue/dist/bootstrap-vue.css';
import 'sweetalert2/dist/sweetalert2.all.min';
import 'summernote/dist/summernote-lite.css';
import '../css/app.css';
import '../css/common.css';

// VueJS application
new Vue({
    el: '#app',
    data: {
        // Loading page spinner,
        isLoading: true,

        // Scroll
        showGoToTop: false,
    },
    created() {
        window.addEventListener('scroll', this.scrollHandler); // Handle scroll
        this.loaded(); // Page loaded.
    },
    methods: {
        /**
         * Page loading
         */
        loaded() {
            this.isLoading = false;
        },

        /**
         * Go to top
         */
        scrollToTop() {
            window.scroll({top: 0, left: 0, behavior: 'smooth'});
        },
        scrollHandler() {
            this.showGoToTop = document.body.scrollTop > 100 || document.documentElement.scrollTop > 100; // Display 'Go to top' button
        },
    }
});

一切正常，我的summernote已添加到我的页面，但未添加到原始文本区域。库禁用了我的原始文本区域（具有给定的summernote类的字段），并使用特定的summernote设计和数据创建了另一个div。

如您所见，我使用的是Summernote的精简版。我的预期行为是：单击提交后，我的原始文本区域应该包含summernote中的所有文本，但是summernote从未更新原始文本区域。

怎么了？

更新：我刚刚意识到格式化也不起作用。

Summernote.js + Webpack Encore-不更新原始输入

0 个答案: