如何在CKEditor插件中同步读取json文件
How to read json file in CKEditor plugin synchronous
我需要为 CKEditor 5 创建一个自定义插件,它将读取 JSON 并将在工具栏的下拉列表中显示数据。
我遇到的问题是在 Init 方法中将列表设置到配置之前未完成的异步获取数据。
export default class PlaceholderEditing extends Plugin {
static get requires() {
return [Widget];
}
init() {
this._defineSchema();
this._defineConverters();
this.editor.commands.add('placeholder', new PlaceholderCommand(this.editor));
this.editor.editing.mapper.on(
'viewToModelPosition',
viewToModelPositionOutsideModelElement(this.editor.model, viewElement => viewElement.hasClass('placeholder'))
);
var items=new Array();
fetch('/GetTerms').then(response => {
if (!response.ok) {
throw new Error("HTTP error " + response.status);
}
return response.json();
}).then(data => {
items = data;
});
this.editor.config.define('placeholderConfig', {
types: items
});
}
在此代码项中始终为空,因为配置定义在获取完成之前为 运行。
我不能将 config.define 放在 then 子句中,因为 init 方法将在它之前完成。
那么,我怎样才能强制获取等待结果或者更好地说我怎样才能获取数据同步而不是异步?
最后,我通过在我的构造函数中添加异步函数解决了我的问题
init() {
return (async () => {
this._defineSchema();
this._defineConverters();
this.editor.commands.add('placeholder', new PlaceholderCommand(this.editor));
this.editor.editing.mapper.on(
'viewToModelPosition',
viewToModelPositionOutsideModelElement(this.editor.model, viewElement => viewElement.hasClass('placeholder'))
);
var items = new Array();
await fetch('contractTerms.json').then(response => {
if (!response.ok) {
throw new Error("HTTP error " + response.status);
}
return response.json();
}).then(data => {
console.log(data.items);
items = data.items;
});
console.log('pass');
this.editor.config.define('placeholderConfig', {
types: items
});
})();
我需要为 CKEditor 5 创建一个自定义插件,它将读取 JSON 并将在工具栏的下拉列表中显示数据。 我遇到的问题是在 Init 方法中将列表设置到配置之前未完成的异步获取数据。
export default class PlaceholderEditing extends Plugin {
static get requires() {
return [Widget];
}
init() {
this._defineSchema();
this._defineConverters();
this.editor.commands.add('placeholder', new PlaceholderCommand(this.editor));
this.editor.editing.mapper.on(
'viewToModelPosition',
viewToModelPositionOutsideModelElement(this.editor.model, viewElement => viewElement.hasClass('placeholder'))
);
var items=new Array();
fetch('/GetTerms').then(response => {
if (!response.ok) {
throw new Error("HTTP error " + response.status);
}
return response.json();
}).then(data => {
items = data;
});
this.editor.config.define('placeholderConfig', {
types: items
});
}
在此代码项中始终为空,因为配置定义在获取完成之前为 运行。 我不能将 config.define 放在 then 子句中,因为 init 方法将在它之前完成。
那么,我怎样才能强制获取等待结果或者更好地说我怎样才能获取数据同步而不是异步?
最后,我通过在我的构造函数中添加异步函数解决了我的问题
init() {
return (async () => {
this._defineSchema();
this._defineConverters();
this.editor.commands.add('placeholder', new PlaceholderCommand(this.editor));
this.editor.editing.mapper.on(
'viewToModelPosition',
viewToModelPositionOutsideModelElement(this.editor.model, viewElement => viewElement.hasClass('placeholder'))
);
var items = new Array();
await fetch('contractTerms.json').then(response => {
if (!response.ok) {
throw new Error("HTTP error " + response.status);
}
return response.json();
}).then(data => {
console.log(data.items);
items = data.items;
});
console.log('pass');
this.editor.config.define('placeholderConfig', {
types: items
});
})();