soundar24 / roundSlider

roundSlider - A free jQuery plugin
https://roundsliderui.com/
MIT License
267 stars 80 forks source link

React integration #92

Open aaron170 opened 5 years ago

aaron170 commented 5 years ago

React Integration

Is it possible to integrate this plugin with React components?

I have tried it but getting errors in JS file for ESLint Rules.

`Failed to compile ./src/roundslider.js Line 360: Expected an assignment or function call and instead saw an expression no-unused-expressions Line 423: Expected an assignment or function call and instead saw an expression no-unused-expressions Line 452: Expected an assignment or function call and instead saw an expression no-unused-expressions Line 600: Expected an assignment or function call and instead saw an expression no-unused-expressions Line 626: 'ko' is not defined no-undef Line 638: 'ko' is not defined no-undef Line 644: 'angular' is not defined no-undef Line 653: 'angular' is not defined no-undef Line 715: Expected an assignment or function call and instead saw an expression no-unused-expressions Line 861: Expected an assignment or function call and instead saw an expression no-unused-expressions Line 867: Expected an assignment or function call and instead saw an expression no-unused-expressions Line 872: Expected an assignment or function call and instead saw an expression no-unused-expressions Line 927: Expected an assignment or function call and instead saw an expression no-unused-expressions Line 963: 'opr' is not defined no-undef Line 1250: 'jQuery' is not defined no-undef

Search for the keywords to learn more about each error.`

Please help me sort these issues so I can run it in React.

Thanks

soundar24 commented 5 years ago

@aaron170 I have created a react project with roundSlider integration, I hope this helps you:

https://stackblitz.com/edit/react-jquery-round-slider

1) install "jquery" and "round-slider" 2) Simply copy the "RoundSlider.js" file into your application 3) Wherever going to use roundSlider, import and use like in "index.js"

If you need any further functionalities then you can extend the class.

Reference from: https://notes.devlabs.bg/how-to-use-jquery-libraries-in-the-react-ecosystem-7dfeb1aafde0

aaron170 commented 5 years ago

@aaron170 I have created a react project with roundSlider integration, I hope this helps you:

https://stackblitz.com/edit/react-jquery-round-slider

  1. install "jquery" and "round-slider"
  2. Simply copy the "RoundSlider.js" file into your application
  3. Wherever going to use roundSlider, import and use like in "index.js"

If you need any further functionalities then you can extend the class.

Reference from: https://notes.devlabs.bg/how-to-use-jquery-libraries-in-the-react-ecosystem-7dfeb1aafde0

Thanks a lot Soundar. That helped me a lot. Used it in my project and worked like a charm...