reactdatagrid
reactdatagrid copied to clipboard
Invalid prop `disabled` of type `string` supplied to `InovuaCheckBox`, expected `boolean`
I experienced this warning with both community and enterprise edition as well, at column visibility change on the context menu:
https://user-images.githubusercontent.com/8656998/218294774-ec7905d1-6fa4-4138-91d2-ea83a172fa3f.mp4
Warning: Failed prop type: Invalid prop `disabled` of type `string` supplied to `InovuaCheckBox`, expected `boolean`.
at InovuaCheckBox (http://localhost:3001/static/js/bundle.js:24128:34)
at MenuItem (http://localhost:3001/static/js/bundle.js:34925:34)
at tbody
at table
at div
at http://localhost:3001/static/js/bundle.js:31539:96
at div
at div
at div
at div
at div
at InovuaScrollContainer (http://localhost:3001/static/js/bundle.js:46240:34)
at div
at http://localhost:3001/static/js/bundle.js:31539:96
at InovuaArrowScroller (http://localhost:3001/static/js/bundle.js:22558:34)
at div
at InovuaMenu (http://localhost:3001/static/js/bundle.js:33230:34)
at div
at div
at InovuaMenu (http://localhost:3001/static/js/bundle.js:33230:34)
at div
at http://localhost:3001/static/js/bundle.js:14494:41
at TheGrid (http://localhost:3001/static/js/bundle.js:15718:43)
at __WEBPACK_DEFAULT_EXPORT__
at div
at App
overrideMethod @ react_devtools_backend.js:4012
printWarning @ react.development.js:209
error @ react.development.js:183
checkPropTypes @ react.development.js:2074
validatePropTypes @ react.development.js:2275
createElementWithValidation @ react.development.js:2379
renderSelectInput @ index.js:299
renderCells @ index.js:228
render @ index.js:61
finishClassComponent @ react-dom.development.js:19752
updateClassComponent @ react-dom.development.js:19698
beginWork @ react-dom.development.js:21611
beginWork$1 @ react-dom.development.js:27426
performUnitOfWork @ react-dom.development.js:26557
workLoopSync @ react-dom.development.js:26466
renderRootSync @ react-dom.development.js:26434
performSyncWorkOnRoot @ react-dom.development.js:26085
flushSyncCallbacks @ react-dom.development.js:12042
(anonymous) @ react-dom.development.js:25651
package.json dependencies:
"dependencies": {
"@inovua/reactdatagrid-enterprise": "^5.8.4",
"@testing-library/jest-dom": "^5.16.5",
"@testing-library/react": "^13.4.0",
"@testing-library/user-event": "^13.5.0",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-scripts": "5.0.1",
"web-vitals": "^2.1.4"
}
I took the example code from here:
https://reactdatagrid.io/docs/getting-started
import React from 'react'
import ReactDataGrid from '@inovua/reactdatagrid-enterprise'
import '@inovua/reactdatagrid-enterprise/index.css'
const columns = [
{ name: 'name', header: 'Name', minWidth: 50, defaultFlex: 2 },
{ name: 'age', header: 'Age', maxWidth: 1000, defaultFlex: 1 }
]
const gridStyle = { minHeight: 550 }
const dataSource = [
{ id: 1, name: 'John McQueen', age: 35 },
{ id: 2, name: 'Mary Stones', age: 25 },
{ id: 3, name: 'Robert Fil', age: 27 },
{ id: 4, name: 'Roger Robson', age: 81 },
{ id: 5, name: 'Billary Konwik', age: 18 },
{ id: 6, name: 'Bob Martin', age: 18 },
{ id: 7, name: 'Matthew Richardson', age: 54 },
{ id: 8, name: 'Ritchie Peterson', age: 54 },
{ id: 9, name: 'Bryan Martin', age: 40 },
{ id: 10, name: 'Mark Martin', age: 44 },
{ id: 11, name: 'Michelle Sebastian', age: 24 },
{ id: 12, name: 'Michelle Sullivan', age: 61 },
{ id: 13, name: 'Jordan Bike', age: 16 },
{ id: 14, name: 'Nelson Ford', age: 34 },
{ id: 15, name: 'Tim Cheap', age: 3 },
{ id: 16, name: 'Robert Carlson', age: 31 },
{ id: 17, name: 'Johny Perterson', age: 40 }
]
export default () => <ReactDataGrid
idProperty="id"
columns={columns}
dataSource={dataSource}
style={gridStyle}
/>
The possible solution is to build the project, in the built project the warn message disappear!
How can I make it not appear in the development environment?