Есть ли способ запустить событие onPaste для React Material <TableRow>в Internet Explorer? - PullRequest
Новая
       13

Есть ли способ запустить событие onPaste для React Material <TableRow>в Internet Explorer?

0 голосов
/ 23 апреля 2019

Я разрабатываю таблицу данных, которая должна обеспечивать возможность вставки строк данных, скопированных из Excel. Однако событие onPaste не сработает в Internet Explorer. Я смог добиться этого и получить данные буфера обмена в Chrome. 

<Table className={classes.table} aria-labelledby="tableTitle">
            <EnhancedTableHead
              numSelected={selected.length}
              order={order}
              orderBy={orderBy}
              onSelectAllClick={this.handleSelectAllClick}
              onRequestSort={this.handleRequestSort}
              rowCount={data.length}
            />
            <TableBody onPaste={event => this.handlePaste(ClipboardEvent)}>
              {stableSort(data, getSorting(order, orderBy))
                .map(n => {
                  const isSelected = this.isSelected(n.id);
                  return (
                    <TableRow
                      hover
                      onClick={event => this.handleClick(event, n.id)}
                      role="checkbox"
                      aria-checked={isSelected}
                      tabIndex={-1}
                      key={n.id}
                      selected={isSelected}
                    >
                      <TableCell padding="checkbox">
                        <Checkbox checked={isSelected} />
                      </TableCell>
                      <TableCell component="th" scope="row" padding="none">
                        {n.udf}
                      </TableCell>
                      <TableCell align="right">{n.ticker}</TableCell>
                      <TableCell align="right">{n.transType}</TableCell>
                      <TableCell align="right">{n.qty}</TableCell>
                      <TableCell align="right">{n.portfolio}</TableCell>
                    </TableRow>
                  );
                })}
              {emptyRows > 0 && (
                <TableRow style={{ height: 49 * emptyRows }}>
                  <TableCell colSpan={6} />
                </TableRow>
              )}
            </TableBody>
          </Table>

1 Ответ

0 голосов
/ 24 апреля 2019

Если вы посмотрите документацию, то обнаружите, что событие вставки поддерживается и совместимость для события OnPaste неизвестна.

Я провел тест с событием OnPaste и обнаружил, что это событие работает в Internet Explorer.

Проблема в том, что данные буфера обмена не поддерживаются в Internet Explorer.

Таким образом, вы не сможете получить доступ к данным, используя их.

enter image description here

Проверенный код: 

<!DOCTYPE html>
<html>
<body>

<input type="text" onpaste="myFunction()" value="Try to paste something in here" size="40">

<p id="demo"></p>

<script>
function myFunction() {
  document.getElementById("demo").innerHTML = "You pasted text!";
}
</script>

</body>
</html>

Вывод в Internet Explorer 11:

enter image description here

Ссылки:

(1) HTMLElement .onpaste

(2) Элемент: вставка события

В качестве альтернативы вы можете попробовать обратиться к примеру в ссылкениже может помочь вам решить проблему.

Кросс-браузерный JavaScript Copy and Paste

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...