Comments (4)
Hi,
I'm sorry if this causes frustration. When I just started this library, I assumed it's no big deal to add harmony
flag to the JSX transform you're probably already using. I'm happy to lose you an hour but get you to use ES6 instead, because frankly it's a better language, but I'm sorry if this causes you more trouble than it's worth.
I don't really plan on rewriting examples to ES5 (it's time to move on, we've been stuck with ES5 for far too long!) but I only use a few language features anyway, and all of them are just syntactic sugar:
// destructuring
// https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment#Object_destructuring
var { something } = obj; // ES6
var something = obj.something; // ES5
// concise method definition syntax
// https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Object_initializer#New_notations_in_ECMAScript_6
var Something = {
doSomething() { } // ES6
}
var Something = {
doSomething: function () { } // ES5
}
// fat arrows (lambas)
// https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions
var card = this.state.cards.filter(c => c.id === id)[0] // ES6
var card = this.state.cards.filter(function (c) { return c.id === id; })[0] // ES5
// template strings
// https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/template_strings
var transform = `translate3d(${this.props.left}px, ${this.props.top}px, 0)` // ES6
transform = 'translate3d(' + this.props.left + 'px, ' + this.props.top + 'px, 0)' // ES5
I don't think I'm using any other ES6 features, please correct me if I'm wrong. It takes less than an hour to get used to them, but in my opinion they give you more concise code in a lot of cases.
Is there a reason you can't enable Harmony transforms in your JSX?
from react-dnd.
I'll close the issue for now. Let me know if you have more questions!
from react-dnd.
(Really late)
Thanks for taking the time to answer with examples and some quality explanation, it actually helped me make the move to ES6.
With the project at hand, I wasn’t ready to enable ES6 (people weren’t open to changing settled parts of the software at that point in time), so I couldn’t test the examples with the workflow we were using.
Anyway, things went well.
I’ll be happy to make a PR with the examples in ES5 if there is interest in that.
from react-dnd.
I'm currently doing a big rewrite and it's all ES6, so there's no point in going back to ES5. You can always look at the compiled code to see how to write the same in ES5 though.
ES6 is not destructive; you can enable the transformation and nobody will notice. Keeping using ES5 at this point is just unnecessary stagnation.
from react-dnd.
Related Issues (20)
- Preview Image only works once, on the first drag. HOT 3
- Uncaught Invariant Violation: Expected an existing source.
- Library breaks textareas, inputs etc. HOT 1
- table 拖拽时 使用最新版本的React-dnd Api时 出现node.addEventListener is not a function
- 拖动时useDrag无法访问组件内的变量 HOT 1
- @react-dnd/asap trigger swc error `env` and `jsc.target` cannot be used together
- Custom Drag Layer elements don't update until AFTER I drag it. HOT 1
- Redux v5
- Where is dropEffect coming from?
- Hello! I am kupraa from Indonesia, I am very excited to join the project and the communitystar_struck. Wish the project success and strong developmentheart
- [Question] Working with DnD and PrimeReact's DataTable HOT 1
- Will there be a new version released ? and when will the next version be released? HOT 1
- Missing license for some inner packages
- Unable to drag list item after removing/unchecking particular items. Need help.
- Cannot write a unit test to make sure that it is not possible to drag some draggable HOT 1
- Adding accessibility features to the library
- Jest encountered an unexpected token HOT 2
- Styling not working in the beginning of the tutorial chessboard.
- run demo online throw error
- Drop dragged item if it intersects more than 50% of the drop area HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from react-dnd.