4 ms·
I think the vague answer is 'use mixins', but they are generally unsatisfying. One hopes that using ES6 classes to define react components this way would allow
by astazangasta 11y ago
I think the vague answer is 'use mixins', but they are generally unsatisfying. One hopes that using ES6 classes to define react components this way would allow proper inheritance, but the whole ES6 thing is a mess that breaks a bunch of other things (notably autobinding this). Upshot is my code remains repetitive.
Where possible you can use composability, extracting common function into a subcomponent, but this doesn't always make for neater code.
- wereHamster 11y agoUgh no. Please don't use mixins or inheritance. Composition is the way to go. https://en.wikipedia.org/wiki/Composition_over_inheritance https://en.wikipedia.org/wiki/Composition_over_inheritance
- Kiro 11y agoDo you have any example React code using composition?
- wereHamster 11y agoSame way you compose functions or HTML elements. Functions: add(1,multiply(2,3)) HTML: <div>foo <span>bar</span> </div> React: <Container> <Header>foo</Header> <p>content</p> </Container>
- Bahamut 11y agoTo be pedantic, that is not quite composition - I've made this exact mistake before too. Composition is where you have a function f o g (o being the traditional mathematical notation for composition), where (f o g)(a) = b satisfies g(f(a)) = b. Composition is a useful tool, and so is writing functions like this, but they are two different ideas.
- coldtea 11y ago>but the whole ES6 thing is a mess that breaks a bunch of other things (notably autobinding this). That's trivial to fix...
- mbrock 11y agoHow?
- acemarke 11y agoUse one of the community-built subclasses of React.Component that provide auto-binding, like https://github.com/philpl/react-compat-component https://github.com/philpl/react-compat-component, or a utility function that's a one-line call like https://github.com/cassiozen/React-autobind https://github.com/cassiozen/React-autobind.