Custom Context Menu example

优质
小牛编辑
120浏览
2023-12-01

An implementation of the @handsontable/react component with a custom Context Menu added.

import React from 'react'; import ReactDOM from 'react-dom'; import { HotTable } from '@handsontable/react'; import Handsontable from 'handsontable'; class App extends React.Component { constructor(props) { super(props); this.hotSettings = { data: Handsontable.helper.createSpreadsheetData(5, 5), colHeaders: true, contextMenu: { items: { 'row_above': { name: 'Insert row above this one (custom name)' }, 'row_below': {}, 'separator': Handsontable.plugins.ContextMenu.SEPARATOR, 'clear_custom': { name: 'Clear all cells (custom)', callback: function() { this.clear(); } } } } }; } render() { return ( ); } } ReactDOM.render(, document.getElementById('example1'));

Edit this page