lore-generate-component
Generates a new React component in src/components
Generates a new React component in src/components
Providing --connect
as an argument will generate a component wrapped in the lore.connect
decorator.
lore generate component MyComponent --connect
import React from 'react';
import createReactClass from 'create-react-class';
import PropTypes from 'prop-types';
import { connect } from 'lore-hook-connect';
export default connect((getState, props) => {
return {
// models: getState('model.find')
};
})(
createReactClass({
displayName: 'MyComponent',
propTypes: {
// models: PropTypes.object.isRequired
},
render() {
return (
<div></div>
);
}
})
);
import React from 'react';
import PropTypes from 'prop-types';
import { connect } from 'lore-hook-connect';
class MyComponent extends React.Component {
constructor(props) {
super(props);
// Set your initial state here
// this.setState = {};
// Bind your custom methods so you can access the expected 'this'
// this.myCustomMethod = this.myCustomMethod.bind(this);
}
render() {
return (
<div></div>
);
}
}
MyComponent.propTypes = {
// models: PropTypes.object.isRequired
};
export default connect((getState, props) => {
return {
// models: getState('model.find')
};
})(MyComponent);
import React from 'react';
import PropTypes from 'prop-types';
import { connect } from 'lore-hook-connect';
@connect((getState, props) => {
return {
// models: getState('model.find')
};
})
class MyComponent extends React.Component {
static propTypes = {
// models: PropTypes.object.isRequired
};
constructor(props) {
super(props);
// Set your initial state here
// this.setState = {};
// Bind your custom methods so you can access the expected 'this'
// this.myCustomMethod = this.myCustomMethod.bind(this);
}
render() {
return (
<div></div>
);
}
}
export default MyComponent;