some problems with vue
Closed this issue · 7 comments
I want to use ScratchCard with Vue, but i find that if ScratchCard is used in vue child route, it can not be scratched
{ path: '/', component: index, children: [ { name: 'intro', path: '/intro', component: intro }, { name: 'question', path: '/question', component: question }, { name: 'result', path: '/result', component: result }, { name: 'cj', path: '/cj', component: cj } ] }
Hi, have you got anything more to show ?
I use ScratchCard with nuxt for the demo page, i import SratchCard and instantiate it inside mounted method.
I find the problem. ScratchCard use getBoundingClientRect() to get the position of canvas, but if i add some css3 animation such as bounceInDown in animate.css to dom element, getBoundingClientRect() will change.
I got some problems with another script that had animations and getBoundingClientRect().
I will change that.
You can clone the branch master:
yarn install
yarn dev
and choose the dist folder localhost:8080/dist
you can test it
I waiting your feedback 😸
It works, ths.
In package.json, you can change
"dev": "NODE_ENV=development concurrently \"webpack\" \"webpack-dev-server\" ",
to
"dev": "set NODE_ENV=development && concurrently \"webpack\" \"webpack-dev-server\" ",
because powershell in windows system doesn't support NODE_ENV
I added cross-env to supports NODE_ENV and i pusblished on npm.
thank you very much 😊