将React与TypeScript一起使用
请有人提供一个示例,说明我如何能够使用Kendo DataSource从内部使用Axios的方法读取JSON数据的外部API。我必须飞过20个不同版本的代码尝试不同的方法,似乎没有什么适合...
我目前正在尝试做的就是提供一个带有{id:number,name:string}数组的Kendo ComboBox
目前非常基本的东西,但我必须使用类似的方法稍后使用Kendo Grid来处理服务器端排序和分页,所以我现在想让它工作,那么以后应该会更容易一些。 ..
我想使用Axios的原因是因为我编写了一个api.ts文件,它在gets和posts等上附加了适当的标题,并且很好地处理了错误(即当auth被拒绝等等...)
我正在尝试的一个基本例子,它不起作用是这样的: -
public dataSource: any;
constructor(props: {}) {
super(props);
this.dataSource = new kendo.data.DataSource({
type: "odata",
transport: {
read: function() {
return [{ id: 1, name: "Blah" }, { id: 2, name: "Thing" }];
}.bind(this)
},
schema: {
model: {
fields: {
id: { type: "number" },
name: { type: "string" }
}
}
}
});
}
<ComboBox
name="test"
dataSource={this.dataSource}
placeholder={this.placeholder}
dataValueField="id"
dataTextField="name"
/>
有人对此有任何想法吗? :)
最后轻松修复......
this.dataSource = new kendo.data.DataSource({
transport: {
read: function(options: any) {
options.success([{ id: 1, name: "Blah" }, { id: 2, name: "Thing" }]);
}.bind(this)
},
schema: {
model: {
fields: {
id: { type: "number" },
name: { type: "string" }
}
}
}
});
2件事都错了..
删除了类型:“odata”,并添加了选项的用法
现在使用async await函数工作正常,只需将数据传递到promise中的.then中的options.success即可。任务完成 :-)