当数组在 ReactJS 中更改其值时如何强制重新渲染

Question

当数组在 ReactJS 中更改其值时如何强制重新渲染。

我有一个像

这样的数组

const [providers, setProviders] = useState<Array<any>>(props.filters?.providers!);

当我调用删除函数删除此数组的一个元素时，视图不会呈现。

let OnDelete = (prop: any, func: any, p: IFilter) => {
    const index = prop.findIndex((x: IFilter) => x.code == p.code);
    if (index !== -1) {
        prop.splice(index, 1);
    }
    func(prop);
};

Answer 1

当我希望页面在使用适合我的挂钩时再次呈现时，我有一个工作方法。

我只是声明一个状态，然后将其值更改为强制 re-render，像这样

const [providers, setProviders] = useState<Array<any>>(props.filters?.providers!);
const [refresh, setRefresh] = useState<boolean>(false);

const OnDelete = (prop: any, func: any, p: IFilter) => {
    const index = prop.findIndex((x: IFilter) => x.code == p.code);
    if (index !== -1) {
        prop.splice(index, 1);
    }
    func(prop);
    setRefresh(!refresh) //**Here i force a re render when changing th state**
}

希望对你有用:)

当数组在 ReactJS 中更改其值时如何强制重新渲染

How to force re render when an array changes its value in ReactJS

reactjs

render