The following paragraph is in node schema, when I implement a font option like the heading style, it is possible to change the font through the menu, but it is not possible to highlight a selected font in the menu! I’ve been trying to solve this problem for ages! Hope to get advice!
typeface: {
schema: {
attrs: { type: { default: 'Arial' }, align: { default: undefined }, margin: { default: '0 0 10px 0' }, lineHeight: { default: '1' } },
// attrs: { type: { default: 'Arial' }},
content: 'inline*',
group: 'block',
defining: true,
parseDOM: [
{
tag: 'p',
getAttrs: dom => {
return {
type: dom.style.fontFamily,
align: dom.style.textAlign,
margin: dom.style.margin,
lineHeight: dom.style.lineHeight,
};
}
}
],
toDOM(node) {
const type = node.attrs.type || "Arial";
const align = node.attrs.align || '';
alignment = align;
let style = `font-family:${type};text-align:${align};margin:0 0 10px 0;line-height:1;`
return ['p', { style }, 0];
},
},
// view(node) {
// const el = document.createElement('p');
// el.style.fontFamily = node.attrs.type;
// el.style.margin = '0 0 10px 0';
// el.style.lineHeight = '1';
// // el.style.textAlign = node.attrs.align ? node.attrs.align : alignment;
// el.style.textAlign = node.attrs.align || '';
// alignment = '';
// return {
// dom: el,
// contentDOM: el,
// };
// },
},
blockTypeItem(typeface, { attrs: { type: "宋体,宋体-简,宋体-繁" }, ignoreAttrs: ['align'] }, { group: 'blocks', label: '宋体', }),
blockTypeItem(typeface, { attrs: { type: "黑体,黑体-简,黑体-繁" }, ignoreAttrs: ['align'] }, { group: 'blocks', label: '黑体', }),
blockTypeItem(typeface, { attrs: { type: "Microsoft YaHei" }, ignoreAttrs: ['align'] }, { group: 'blocks', label: '微软雅黑', }),
blockTypeItem(typeface, { attrs: { type: "Arial" }, ignoreAttrs: ['align'] }, { group: 'blocks', label: 'Arial', }),
blockTypeItem(typeface, { attrs: { type: "Times New Roman" }, ignoreAttrs: ['align'] }, { group: 'blocks', label: 'Times New Roman', }),
blockTypeItem(typeface, { attrs: { type: "Calibri" }, ignoreAttrs: ['align'] }, { group: 'blocks', label: 'Calibri', }),
blockTypeItem(typeface, { attrs: { type: "DengXian" }, ignoreAttrs: ['align'] }, { group: 'blocks', label: 'DengXian', }),
blockTypeItem(typeface, { attrs: { type: "Segoe UI" }, ignoreAttrs: ['align'] }, { group: 'blocks', label: 'Segoe UI', }),
blockTypeItem(typeface, { attrs: { type: "'Frutiger 45 Light'" }, ignoreAttrs: ['align'] }, { group: 'blocks', label: "Frutiger 45 light", }),
blockTypeItem(typeface, { attrs: { type: "Montserrat" }, ignoreAttrs: ['align'] }, { group: 'blocks', label: 'Montserrat', }),