Javascript React JS：使用state动态更新作为对象中的值的输入的属性（例如，type）

我有一个名为

字段
的状态，它是一个对象数组。每个对象都有其html表单，如您所见：

fields: [
    {
        field: <input />,
        inputType: 'number'
    }
]

字段：[
{
字段：，
输入类型：“数字”
}
]

我想做的是在用户在应用程序的其他地方进行交互时，向输入添加一个type属性，该属性将使用inputType的值进行更新

（我已经为用户交互部分设置了函数。基本上，用户从下拉列表中选择他们想要的类型。此下拉列表包括基本HTML输入类型，如文本、输入等。选择类型后，它将自动更新inputType的值。我已经为该部分设置了函数。）

我尝试过几件事，但都没有成功：

想法1：

fields: [
    {
        field: <input type={this.inputType} />,
        inputType: 'number'
    }
]

字段：[
{
字段：，
输入类型：“数字”
}
]

想法2：

fields: [
    {
        field: <input type={`this.inputType`} />,
        inputType: 'number'
    }
]

字段：[
{
字段：，
输入类型：“数字”
}
]

想法3：

fields: [
    {
        field: <input type={inputType} />,
        inputType: 'number'
    }
]

字段：[
{
字段：，
输入类型：“数字”
}
]

我认为
this
关键字在HTML表单类型的属性中作为对象中的值起作用，这是错误的吗

提前谢谢，如果有任何问题需要澄清，请告诉我。
您可以将
字段
更改为a，然后返回JSX元素（如idea1所示）。或者，您可以将对象映射到输入元素数组，将
inputType
设置为每个元素的输入。谢谢。我尝试了您的第一个建议，但它仍然给我相同的错误消息：TypeError:无法读取未定义的属性“inputType”。我想这是因为当我输入this关键字时，我实际上指向的是输入本身，而不是整个对象。（找到本文：）您的替代解决方案可以工作，但它与我的应用程序的其余部分不太匹配。（我没有提到，但这些字段基本上都是拖放到一个区域上，然后呈现其字段值。）这篇文章略有不同，因为您使用的不是HTML输入，而是JSX输入。因此，在您的情况下，
此
将是对象本身，对象的代码将在对象创建后进行计算。我试着用一个getter来使用你的代码，它似乎起作用了：它起作用了！非常感谢。我误解了您的第一条评论，将inputType设置为getter，而不是字段。你的建议现在很管用。也谢谢你的jsfiddle。