Как передать данные во вновь добавленные компоненты элемента массива - PullRequest
Новая
       27

Как передать данные во вновь добавленные компоненты элемента массива

0 голосов
/ 12 марта 2020

Как передать дополнительные данные вновь добавленным компонентам массива с помощью onAddClick? onAddClick: (event) => void: функция, которая добавляет новый элемент в массив.

документы

Мне просто нужно скопировать элемент и создать новый с данные кликнули один.

Так я удаляю элемент 

const handleRemove = () => {
if (typeof formContext.removeObject === 'function') {
  formContext.removeObject(index, props.onDropIndexClick(index), title);
} else {
  props.onDropIndexClick(index)();
}

};

Так я их рендую 

export function CardArray(props) {
  const classes = useStyles();
  const { title, items, canAdd, onAddClick, formContext } = props;

  return (
    <Card className={classes.wrapper}>
      <CollapseTitle title={title}>
        {items.map(element => arrayItem(element, formContext, classes, 
         title))}           
      </CollapseTitle>
      {canAdd && (
        <CardActions>
          <Fab
            className={classes.addObjButton}
            color="primary"
            size="small"
            onClick={onAddClick}
          >
            <AddIcon />
          </Fab>
        </CardActions>
      )}
    </Card>
   ); 
 }

1 Ответ

0 голосов
/ 12 марта 2020

Вы можете использовать функцию updater при изменении состояний: 

const onAddClick = () => {
 this.setState(prevState => ({
  items: [...prevState.items, newItem]
 }))
}

вы также можете concat потому что она возвращает новый массив: 

const onAddClick = () => {
  this.setState({ 
   items: this.state.items.concat([newItem])
  })
}

или если вы знакомы с ES6 (что я думаю, что вы делаете), то вы можете использовать Spread Operator: 

const onAddClick = () => {
  this.setState({
   arrayvar: [...this.state.arrayvar, newelement]
  })
}
...