如何将自己的元素限制为仅包含纯文本

Question

如何创建只能包含纯文本的块元素？(没有粗体、斜体等(。

我已将我的元素注册为：

model.schema.register(mtHeaderLine, {
// Changing inheritAllFrom to '$block' creates an editable element
// but then it can contain bold text.
inheritAllFrom: '$text',  
allowIn: mtHeaderDiv,
isBlock: true
});

然后我沮丧地说：

editor.conversion.for('downcast').add(downcastElementToElement( { model: mtHeaderLine, view: 'div' }

但这会创建一个我无法编辑的元素。

我还试着用来降低情绪

view: (modelElement, viewWriter ) => { 
const viewElement=viewWriter.createEditableElement('div',{ 'class': (mtHeaderLine) ,isghost: isGhost });
return viewElement;
}

但这也没有给我一个可编辑的元素。

Answer 1

您需要使用Schema#addAttributeCheck()。该方法允许您注册一个回调，该回调将禁止某些上下文中的$text上的所有属性(例如，模型<plaintext>元素的子元素(：

function MyPlugin( editor ) {
editor.model.schema.register( 'plaintext', {
inheritAllFrom: '$block'
} );
editor.model.schema.addAttributeCheck( ( ctx, attrName ) => {
if ( ctx.endsWith( 'plaintext $text' ) ) {
return false;
}
} );
editor.conversion.elementToElement( {
model: 'plaintext',
view: 'div'
} );
}
ClassicEditor
.create( document.getElementById( 'editor' ), {
plugins: [ ...ClassicEditor.builtinPlugins, MyPlugin ]
} )
.then( editor => {
window.editor = editor;
} )
.catch( error => {
console.error( error );
} );

演示：https://jsfiddle.net/rvas7pLn/1/