从URL解析JSON和在Kendo React DropdownList中放置值

时间:2018-12-11 21:29:55

标签: kendo-react-ui

我是编程和剑道的新手。我使用Kendo React编写了一些简单的代码来生成单个下拉列表,在其中我对值进行了硬编码-

  import React, { Component } from 'react';
    import { DropDownList } from '@progress/kendo-react-dropdowns';
    import '@progress/kendo-theme-default/dist/all.css';
    import './App.css';

    class App extends Component {
        services = [ "Oxygen Therapy", "CPAP-DME Reimbursement", "Empty Deck Maker" ];

        render() {
            return (
            <div>
              <h2>Select CDS Service</h2>
                <DropDownList data={this.services} />
            </div>
            );
        }
    }

export default App;

- 现在,我需要在通过URL传递给我的JSON文件中使用“标题”值,而且我不确定从哪里开始。这是JSON的示例-

{
   "services": [
        { 
            "id": "empty-deck-create",
            "title": "Empty Deck Maker",
            "description": "Generates an empty card deck",
            "hook": "empty-deck-create"
        }
    ]
}

1 个答案:

答案 0 :(得分:2)

这将需要使用textField property。此属性告诉DropDown在传递的对象中显示哪个字段。

<DropDownList data={this.services} textField={"title"}/>