Программная вставка цитаты с последующей новой строкой в ​​CKEditor 5

Я успешно создал плагин для ckeditor 5, который позволяет пользователям выбирать одно или несколько предыдущих сообщений со страницы, и после нажатия кнопки «применить кавычки» он вставляет выбранные сообщения в представление редактора один за другим как цитаты.

Это работает нормально, однако я хотел бы, чтобы курсор находился на новой строке после последней цитаты, чтобы пользователь мог добавлять свои собственные комментарии.

скриншот

Я попытался добавить тег абзаца к списку цитат, но он появляется как новый абзац ВНУТРИ последней цитаты, а не после нее.

У кого-нибудь есть решение для этого?


person TheSteed    schedule 19.07.2018    source источник
comment
Я полностью изменил свой предыдущий ответ, потому что не понял, чего вы хотите достичь. Простите за беспорядок.   -  person pomek    schedule 25.07.2018


Ответы (1)


Я написал простую функцию, которая добавляет в редактор цитируемый текст и абзац для ответа пользователя.

/**
 * @param {String} author An author of the message.
 * @param {String} message A message that will be quoted.
 */
function replyTo( author, message ) {
    // window.editor must be an instance of the editor.
    editor.model.change( writer => {
        const root = editor.model.document.getRoot();
        const blockQuote = writer.createElement( 'blockQuote' );
        const authorParagraph = writer.createElement( 'paragraph' );
        const messageParagraph = writer.createElement( 'paragraph' );

        // Inserts: "Author wrote:" as bold and italic text.
        writer.insertText( `${ author } wrote:`, { bold: true, italic: true }, authorParagraph );

        // Inserts the message.
        writer.insertText( message, messageParagraph );

        // Appends "Author wrote" and the message to block quote.
        writer.append( authorParagraph, blockQuote );
        writer.append( messageParagraph, blockQuote );

        // A paragraph that allows typing below the block quote.
        const replyParagraph = writer.createElement( 'paragraph' );

        // Appends the block quote to editor.
        writer.append( blockQuote, root );

        // Appends the reply paragraph below the block quote.
        writer.append( replyParagraph, root );

        // Removes the initial paragraph from the editor.
        writer.remove( root.getChild( 0 ) );

        // And place selection inside the paragraph.
        writer.setSelection( replyParagraph, 'in' );
    } );

    editor.editing.view.focus();
}

Если у вас возникнут вопросы о том, как настроить его на свой код, я хотел бы увидеть код, который вы написали. Это позволит понять, что вы сделали.

Конечно, вы можете увидеть предложенный код в виде онлайн-демонстрации — https://jsfiddle.net/pomek/s2yjug64/

person pomek    schedule 20.07.2018
comment
Вопрос был об установке выделения после кавычки блока. Ваш ответ показывает, как установить его внутри блочной кавычки. - person Reinmar; 23.07.2018