CODEWITHSUNDEEP
reactjsreact-table
Chris3y
Chris3y

Reputation: 178

Uncaught TypeError: (0 , _reactTable.useTable) is not a function

Trying to follow a working example of using react-table in an editable fashion: https://codesandbox.io/s/github/tannerlinsley/react-table/tree/master/examples/editable-data

I've wholesale copied and pasted the code but unable to get it working.

screenshot

Hunting round the web, I understand a common cause for the error is not using curly braces to import non-default exports (which this is).

I'm very new to javascript/react etc (normally work in .net) so I'm assuming this is something really basic.

I've split out the two imports into separate lines as a troubleshooting step but no change in output:

import { useTable } from 'react-table'
import { usePagination } from 'react-table'

here's my package.json

{
  "name": "test",
  "version": "1.0.0",
  "description": "",
  "scripts": {
    "ci": "npm run lint -- ./src && npm run jest",
    "start": "npm run webpack-dev-server",
    "build": "set NODE_ENV=dev&& npm run webpack",
    "test": "node --inspect=0.0.0.0:9229 ./node_modules/jest/bin/jest --watchAll",
    "jest": "./node_modules/.bin/jest",
    "lint": "./node_modules/.bin/eslint",
    "webpack": "./node_modules/.bin/webpack",
    "webpack-dev-server": "./node_modules/.bin/webpack-dev-server"
  },
  "author": "",
  "license": "UNLICENSED",
  "dependencies": {
    "babel-plugin-syntax-dynamic-import": "^6.18.0",
    "carbon-react": "^4.0.0",
    "create-carbon-app": "^1.0.3",
    "namor": "^1.1.2",
    "react": "^16.8.6",
    "react-dom": "^16.8.6",
    "react-router": "^5.0.1",
    "react-router-dom": "^5.0.1",
    "react-table": "^6.10.0",
    "styled-components": "^4.3.2"
  },
  "devDependencies": {
    "carbon-factory": "^5.0.0",
    "enzyme": "^3.0.0",
    "enzyme-adapter-react-16": "^1.0.0",
    "webpack-cli": "^3.3.6",
    "webpack-dev-server": "^3.7.1"
  }
}

If I remove the line all together then I get "useTable is not defined" Hoping someone can point me in the directions of things to check/investigate beyond just importing with curly braces.

Upvotes: 3

Views: 2456

Answers (1)

simon
simon

Reputation: 1105

You are using react-table version 6.10.0. useTable is introduced in version 7 which is currently in alpha, if you want to use that you need to install v7.0.0-alpha.2 instead.

So in your package.json

"react-table": "^6.10.0",

needs to be

"react-table": "v7.0.0-alpha.2",

then run npm install to reinstall the correct version

Upvotes: 4

Related Questions