Блог

Я попытался назначить div параллельно на моем веб-сайте react. Тем не менее, я получил ошибку Uncaught Invariant Violation: Minified React error .

Это моя панель инструментов на моем веб-сайте react

 let EnhancedTableToolbar = props => {
  const { numSelected, classes ,deletefunc} = props;

  return (
    <Toolbar
      className={classNames(classes.root, {
        [classes.highlight]: numSelected > 0,
      })}
    >
      <div className={classes.title}>
        {numSelected > 0 ? (
          <Typography color="inherit" variant="subtitle1">
            {numSelected} selected
          </Typography>
        ) : (
          <Typography variant="h6" id="tableTitle">
            User List
          </Typography>
        )}
      </div>
      <div className={classes.spacer} />
      <div className={classes.actions}>
        {numSelected > 0 ? (
        <div>
        <div style="width: 100px; float:right;">
          <Tooltip title="Delete">
            <IconButton aria-label="Delete">
              <DeleteIcon onClick={() => { if (window.confirm('Are you sure you wish to delete ' numSelected  ' item?')) {deletefunc()} } }>
              </DeleteIcon>
            </IconButton>
          </Tooltip>
         </div>
         <div style="width: 100px; float:right;">
          <Tooltip title="Edit">
            <IconButton aria-label="Edit">
              <EditIcon>
              </EditIcon>
            </IconButton>
          </Tooltip>
          </div>
         </div> 


        ) : (
          <Tooltip title="Filter list">
            <IconButton aria-label="Filter list">
              <FilterListIcon />
            </IconButton>
          </Tooltip>
        )}


      </div>
    </Toolbar>
  );
};
  

Я получил ошибку, когда установил ширину в 100 пикселей и переместил вправо в моей кнопке удаления и кнопке редактирования. Код будет работать, если я никогда не установлю ширину и значение float. Однако это разделение вверх вниз, а не рядом. Кто-нибудь знает, как решить эту проблему?

Это не то, как вы определяете встроенные стили в JSX.

style Атрибут принимает объект JavaScript со свойствами camelCased, а не строку CSS.

Попробуйте это вместо:

 <div style={{ width: '100px', float: 'right' }}>