Question

我的表单中的TextField是基于项目数组（是一个状态变量）动态添加的，在填充TextField后，单击“设置值”按钮，我将删除填充的textfield。

在删除的文本字段中输入的值将自动填充到其后续文本字段中，我找不到防止这种行为的方法。

请找到example here

Answer 1

将key添加到您的TextField中。像-

<TextField key={Math.random()}> </TextField>

或

<TextField key={item}> </TextField>，它将解决您的问题。

Answer 2

发生这种情况是因为您使用索引作为键。
来自react docs：

如果项的顺序可能不建议使用索引作为键更改。这会对性能产生负面影响，并可能导致问题具有组件状态。

这就是您的应用程序中正在发生的事情。
您可以参考此article了解更多信息。
代替：

using namespace std;

const int MAX = 10;
typedef char el_t;

class stack {
private: // Private data members are:
    el_t el[MAX];               // el is an array with slots 0 .. MAX-1
    int  top;                   // the index to the top element

public: // Public Prototypes follow:

    stack();
    ~stack();

    bool isEmpty();
    bool isFull();
    void push(el_t);
    void pop(el_t&);
    void displayAll();
    void topElem(el_t&);
    void clearIt();
};

您可以使用

<Grid item key={index}>

如果数组中的每个元素都是（并且将是）唯一的。
如果不是这种情况，则应考虑其他键。

防止本质上是动态的TextField自动填充

2 个答案: