从数组中删除对象-javascript

如果满足某些条件，单击按钮时，我会将div组件推到数组中。我正在视图中显示我的列表。它工作得很好，但在尝试从数组中删除div组件时遇到了问题。为什么当我尝试从数组中删除对象时，列表没有更新，但在向数组中添加对象时，列表工作正常？我想更新我的数组，即使我从数组中删除对象，它也应该实时删除我正在删除的div组件

我已经使用控制台日志进行了检查，当我单击

removetextpoll

时，代码删除了div组件，因此代码工作正常，但问题是我的视图没有被缓存

我的代码如下

class TextVotePost extends Component {
  constructor() {
    super();
    this.state = {
      addOption: 3,
      maxImage: 4,
      optionBtn: true,
    };
    this.addOption = this.addOption.bind(this);
  }

  addOption() {
    this.setState(prevState => ({
      addOption: ++prevState.addOption,
    }));
  }

  render() {
    let list = [];
    const textPollMaxLength = 35;

    function removetextpoll() {
      list.splice(0, 1);
    }

    for (let i = 3; i <= this.state.maxImage; i++) {
      {
        this.state.addOption > i &&
          list.push(
            <div key={i}>
              <div className="txt_vote_bar_div">
                <div onClick={removetextpoll} />

                <Field
                  name={`inputName${i}`}
                  component="input"
                  type="text"
                  placeholder={`Option ${i}`}
                  maxLength={textPollMaxLength}
                />
              </div>
            </div>,
          );
      }
    }

    return (
      <form onSubmit={this.props.handleSubmit}>
        {list}
        <div onClick={this.addOption}>
          <span>Add Option</span>
        </div>
        }
      </form>
    );
  }
}

class TextVotePost扩展组件{
构造函数（）{
超级（）；
此.state={
补充选项：3，
最大年龄：4，
选项BTN：正确，
};
this.addOption=this.addOption.bind（this）；
}
addOption（）{
this.setState（prevState=>({
addOption:+prevState.addOption，
}));
}
render（）{
让列表=[]；
const textPollMaxLength=35；
函数removextpoll（）{
列表。拼接（0，1）；
}
for（设i=3；i）&&
list.push(
,
);
}
}
返回(
{list}
添加选项
}
);
}
}

React组件仅在其状态或道具更改时重新渲染。该列表不是状态或道具的一部分，只是在渲染函数中声明的一些列表

添加选项时，您正在更改

addOption（）

中的状态，但要删除选项，您只需直接拼接该数组。您需要通过状态或道具编辑列表，以便更改触发重新渲染并更新视图

---

正如有人评论的那样（看起来他们现在删除了它），请注意

splice（）

和

slice（）之间的区别

。直接改变状态/道具不会触发重新渲染，还会导致错误和奇怪的行为。要更改道具，您需要传递一个新道具，或者要更改状态，您需要使用

setState（）

重新渲染器是由状态或属性更改触发的。添加时，您正在设置触发重新渲染的状态，但是在删除时，您没有执行任何此类操作，因此，虽然数据可能会被删除，但它不会反映在UIso中。我应该采取什么方法来解决此问题？