c# - 下拉菜单的抓取和渲染值 (React, C#)

Question

我的网站上有一个文件选项卡。我正在添加一个类别下拉列表，以便用户可以根据类别标记他们的文件，以便他们可以更好地组织他们的文件。我无法获取下拉列表的值，因此当我点击保存时，类别值会保存并存储到数据库中，然后在重新加载时与其余的井文件信息一起呈现。

这是在整个网站上完成的，但这里的独特之处在于下拉列表的值不是直接添加到界面中，而是添加到 IWell 的数组中

Public Files: AttachedFile [] = []

我遇到的问题是，尽管显示了下拉列表，但当您更改下拉列表中的值时，下拉列表的值根本不会记录，因此当我保存时，它不会保存类别下拉列表的值。

这是我构建和渲染下拉列表的地方。

private handleInputChange(event: any) {
    const category = this.state.well;
    category[event.target.name] = event.target.value;
    console.log(category);
    this.setState({
    isDirty: true,
    selectedFile: category,
    });
}

public renderDropdown = ({}) => (event: any) => {
    return (
        <FormGroup >
            <EInput
                type="select"
                name="Category"
                value={this.state.well.files}
                onChange={this.handleInputChange[event]}
            >
                <option value="" />
                <option value="Not Categorized">Not Categorized</option>
                <option value="Signed Documents">Signed Documents</option>
                <option value="Unsigned Documents">Unsigned Documents</option>
                <option value="3rd Party Documents">3rd Party Documents</option>
                <option value="General Well Info">General Well Info</option>
            </EInput>
        </FormGroup>
    );
}

为了呈现文件信息，我们只是映射 well.files 并像这样抓取每个类别：

 private formatWellFiles = () => {
    const files = this.state.well.files;
    const headers = [
        "File Name",
        "Category",
        "Size",
        "Uploaded By",
        "Upload Date",
        "Download",
    ];
    const rows = files.map(f => {
        return [
            {
                content: f.name
            },
            {
                content: this.renderDropdown(f.category),
                type: 'render'
            },
            {
                content: this.renderSize(f.size),
                sortItem: Number(f.size),
                type: 'render'
            },
            {
                content: f.createUser
            },
            {
                content: f.createDate
            },
            {
                content: this.renderDownload(f),
                type: 'render',
            },
        ];

    });

我也不能使用类似的东西

onChange={event => this.handleInputChange(event)}

因为它会给我一个错误：禁止绑定

标签： c#reactjs