search

beekai-oss / react-flip-numbers

🎰 Flip your numbers in 3D
https://codesandbox.io/s/exciting-gagarin-xoq9if
MIT License
310 stars 30 forks source link

TypeError: useRef$1 is not a function #12

Closed aburbanol closed 5 years ago

aburbanol commented 5 years ago

I'm using Primereact, node 6.9.0 in a react+redux web application. I installed the library and just by adding the FlipNumbers tag, it shows this error:

TypeError: useRef$1 is not a function Animate node_modules/react-simple-animate/dist/index.js:84 81 | const { useEffect: useEffect$1, useState: useState$1, useRef: useRef$1, useContext } = React; 82 | function Animate(props) { 83 | const { play, children, render, start, end, complete = '', onComplete, delay = 0, duration = 0.3, easeType = 'linear', sequenceId, sequenceIndex, } = props;

84 | const onCompleteTimeRef = useRef$1(null); 85 | const [style, setStyle] = useState$1(start || {}); 86 | const { register, animationStates = {} } = useContext(AnimateContext); 87 | const id = getSequenceId(sequenceIndex, sequenceId);

To Reproduce Steps to reproduce the behavior:

  1. add the to a working page
  2. open the page
  3. See error

Expected behavior to see the example numbers 3D animation

Screenshots image

Desktop (please complete the following information):

Additional context This is the project dependencies:

"dependencies": { "@axetroy/react-download": "^1.1.1", "ajv": "^6.10.0", "axios": "^0.19.0", "babel-polyfill": "^6.26.0", "chart.js": "^2.4.0", "classnames": "^2.2.6", "cross-fetch": "^2.2.2", "fast-deep-equal": "^2.0.1", "font-awesome": "^4.7.0", "fullcalendar": "^3.1.0", "growl": "^1.10.5", "history": "^4.7.2", "i18next": "^11.3.6", "i18next-browser-languagedetector": "^2.2.1", "i18next-locize-backend": "^1.6.0", "jquery": "^3.4.1", "locize-editor": "^1.5.1", "mapbox-gl": "^0.46.0", "moment": "^2.24.0", "node-sass-chokidar": "^1.3.4", "npm-run-all": "^4.1.3", "primeicons": "^1.0.0-beta.10", "primereact": "^2.0.0-beta.1", "quill": "^1.3.1", "react": "^16.4.1", "react-burger-menu": "^2.5.2", "react-csv": "^1.0.14", "react-dom": "^16.4.1", "react-flip-numbers": "^3.0.4", "react-google-maps": "^9.4.5", "react-i18next": "^7.8.1", "react-mapbox-gl": "^3.8.0", "react-native": "^0.60.4", "react-native-maps": "^0.21.0", "react-proxy": "^1.1.4", "react-redux": "^5.0.7", "react-router-dom": "^4.2.2", "react-router-redux": "^5.0.0-alpha.9", "react-scripts": "1.1.4", "react-scrollable-anchor": "^0.6.1", "react-simple-maps": "^0.12.1", "react-superagent": "^1.1.1", "react-table": "^6.8.6", "react-transition-group": "^2.4.0", "recompose": "^0.27.1", "redux": "^4.0.0", "redux-thunk": "^2.3.0", "superagent": "^3.8.3", "superagent-promise": "^1.1.0", "topojson-client": "^3.0.0" }

bluebill1049 commented 5 years ago

you React version is outdated. looks like it doesn't support React Hooks https://reactjs.org/docs/hooks-intro.html

ayu-ayushisood commented 3 years ago

I am using updated React version, still getting this error. Any resolution?