Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

How to extend a JS class? #725

Closed
liamcurry opened this issue Aug 18, 2018 · 1 comment
Closed

How to extend a JS class? #725

liamcurry opened this issue Aug 18, 2018 · 1 comment

Comments

@liamcurry
Copy link
Contributor

Hi there! This is probably a noob question so please feel free to close this issue.

I'm experimenting with creating React components in Rust and I'm trying to wrap my head around how this might work.

React recommends creating components with ES6 classes like so:

const ReactDOM = require('react-dom');
const React = require('react');

class Hello extends React.Component {
    constructor(props) {
        super(props);
        this.state = { name: props.name };
    }

    render() {
        return React.createElement('div', null, `Hello ${this.state.name}`);
    }

    static get defaultProps() {
        return { name: 'Mary' };
    }
}

document.addEventListener('DOMContentLoaded', function () {
    ReactDOM.render(
        React.createElement(Hello, null, null),
        document.getElementById('app')
    );
});

It's also possible to create React components with plain JS objects using the create-react-class package (although creating components this way seems to be depreciated):

const ReactDOM = require('react-dom');
const React = require('react');
const createReactClass = require('create-react-class');

const Hello = createReactClass({
    getDefaultProps: function () {
        return {
            name: 'Mary'
        };
    },
    getInitialState: function () {
        return { name: this.props.name };
    },
    render: function () {
        return React.createElement('div', null, `Hello ${this.state.name}`);
    }
});

document.addEventListener('DOMContentLoaded', function () {
    ReactDOM.render(
        React.createElement(Hello, { name: 'John' }, null),
        document.getElementById('app')
    );
});

From reading the docs it seems like this might be solved using structs and the extends attribute, but I'm pretty new to Rust and I'm having a tough time putting it all together. Are there any examples/tests/docs that could help out here? I imagine an implementation for HTML Custom Elements would require a similar solution. Thanks for your time.

@alexcrichton
Copy link
Contributor

Thanks for the report! Currently this isn't supported, but we want it to be! Supporting this is tracked in #210 and I'm gonna close in favor of that.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants