esbenp / esbenp/react-native-clean-form

blank view

Open
#61 2 comments 0 reactions 0 assignees View on GitHub
Dominant language
JavaScript
Stars
472
Forks
74
PR merge metrics
No merged PRs in 30d

Description

Looking forward to using this. Ran into an issue though. If I have a simple render function with just a it shows the label with text. Anything I put within and I end up with a blank view.
screen shot 2017-09-17 at 7 22 43 pm

Code
```JS
import React, {Component} from 'react';
import PropTypes from 'prop-types';
import {Text, TouchableOpacity} from 'react-native';
import {reduxForm, Field} from 'redux-form/immutable';
import * as regexp from '../inputs/regexp.constants';
import * as formStates from '../forms.constants';
import styles from './login.styles';
import {authenticate} from '../../../states/auth/auth.actions';
import {connect} from 'react-redux';
import {bindRoutineCreators} from 'redux-saga-routines';
import {Button, Form, FieldsContainer, Fieldset, ActionsContainer} from 'react-native-clean-form'
import {Input} from 'react-native-clean-form/redux-form-immutable';

class LoginForm extends Component {
constructor(props) {
super(props);
this.onSubmit = this.onSubmit.bind(this);
}

onSubmit() {
const {handleSubmit, authenticate} = this.props;
//handleSubmit(authenticate).then(
this.props.authenticate().trigger().then(
function (result) {
console.warn(JSON.stringify(result));
}, function (error) {
console.error(JSON.stringify(error));
}
)
}

render() {
const {handleSubmit, authenticate, submitting} = this.props;
return (









Login



);
}
}

const validate = values => {
const errors = {};
values = values.toJS();
errors.email = !values.email
? 'Email field is required'
: !regexp.EMAIL.test(values.email)
? 'Email format is invalid'
: undefined;
errors.password = !values.password
? 'Password field is required'
: values.password.length < 6
? 'Password must be at least 6 characters long'
: undefined;
return errors;
};

LoginForm.propTypes = {
//onSubmit: PropTypes.func.isRequired, // redux-form included
};

function mapStateToProps(state) {
return {
//initialValues: state.get('auth').get('loginInfo'),
};
}

function mapDispatchToProps(dispatch) {
return {
...bindRoutineCreators({authenticate}, dispatch),
};
}

LoginForm = reduxForm({form: 'login', validate: validate})(LoginForm);
export default connect(mapStateToProps, mapDispatchToProps)(LoginForm);
```

Any ideas?

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.