0

I am building a nextjs application. In my project I am not using TypeScript. I am using Javascript. I need a horizontal scroll on mouse wheel and also on touch. I haven't find any react packages. But I find one react package - react-horizontal-scrolling-menu. I see all demo. It perfect for my project. But I am facing one problem. Al of it's example create in TypeScript. But I am not using typeScript. If I copy the code, Then I get many error?

https://codesandbox.io/s/no-scrollbar-and-buttons-position-c3kn5?file=/src/index.tsx

In this situation, What I have to do. I am not understanding?

Please can anyone help me. I am facing this issue over 10 days. Please do not dislike or close my questions.

Improve this question
6
  • I opened the "code sandbox" example and I didn't face any issues! Please attach the error to your question. In addition, If you want to add any ts or tsx file directly to your js project (not as a dependency), then you have to add typescript configs in your nextjs project. Commented Dec 29, 2021 at 8:09
  • It is not my codeSandbox. I want to tell, This codesandbox give example in typeScript. But I need in javascript. Commented Dec 29, 2021 at 8:13
  • If you can, please convert this codesandbox example into a javscript (.js ). Please. Commented Dec 29, 2021 at 8:14
  • Please please please. I really need it. Please. Commented Dec 29, 2021 at 8:15
  • Hello @Mohammad Commented Dec 29, 2021 at 8:25

3 Answers 3

Reset to default
1

Converted to JavaScript. You only needed to remove types and change tsx, ts to jsx, js.

https://codesandbox.io/s/no-scrollbar-and-buttons-on-bottom-forked-m2wci

Improve this answer
Sign up to request clarification or add additional context in comments.

Comments

0

You just need to get rid of every type definition of typescript. Every type in TypeScript is written after the variable name behind ":". So, in the codesandbox example, remove things like ": number" or ": void" at the end of functions.

Edit: im on mobile now, so i can't send you the Javascript code. The things you should look for are on line 17, 20 and 57. Hope the helps you.

Improve this answer

6 Comments

Not working! I am try it. When I remove type then not working scroll on wheel!
Can you give a codesandbox example?
I can't understand what change i have to do on line 17?
Remove it this line in index.tsx. It's a type declaration.
Then it is not working. I mean when I remove it, Then horizontal scrolling not working on mouse wheel.
|
0

I am using also the component for my project which not typescript. As someone suggested I just removed the type definitons in the Arrow function.

Improve this answer

1 Comment

As it’s currently written, your answer is unclear. Please edit to add additional details that will help others understand how this addresses the question asked. You can find more information on how to write good answers in the help center.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.