Question

在子组件之前，我有一连串的反应父母组件：

     <ModalFilterEmployees
                handleClearAll={this.handleClearAll}
                statusStateMap={this.state.status_applied_filters}
                statusChangeHandler={this.handleStatusFilterChange} />

在模式中：

        <p className={styles2.panelTitle}>Status</p><span className={styles.clearFilter} onClick={event => props.handleClearAll()}>X Clear Selected</span>
                        <CheckboxInput
                            name="services"
                            handler={statusChangeHandler}
                            items={statusFilters} // checkbox names from api.
                            stateMap={statusStateMap}
                        />

在复选框输入中：

      const renderCheckboxItems = (items) => {
    if (items.length > 0) {
        return items.map((item, index) => (
            <CheckboxItem key={index} input={item} handler={handler} value={stateMap[item]} ref={ref} />
        ));
    } else return [];
};

const checkboxItems = renderCheckboxItems(items);

return (
    <React.Fragment>
        {/*heading*/}
        <p style={style} className={styles.inputHeader}>{label}</p>

        {/* checkboxes */}
        <div>
            <span className={styles.checkBoxItemContainer}>
                <span>
                    {checkboxItems}
                </span>
            </span>
        </div>
    </React.Fragment>
)

在chekboxItem中

  return (
    <span className={styles.inputContainer} key={input}>
        <label>
            {/* value - raw input */}
            <input {...field} {...props}
                ref={ref}
                   type="checkbox"
                   value={input}
                   checked={value}
                   onChange={(event => handler(input))}
            />
            {/* text - translated input */}
            <span className={styles.label}>{input}</span>
        </label>
    </span>
)
};

当我通过单击更改复选框的值时，它可以正常工作，在处理程序中，我将复选框的名称及其值关联起来，但是当我在clearAll方法中更改状态时，我的复选框不会重新显示，如何解决呢？ / p>

父级更改状态后，React子级不会重新呈现

0 个答案: