在React Native中将值从tcomb形式推送到Firebase

时间:2019-05-14 13:35:24

标签: react-native react-native-firebase tcomb-form-native

我已经在react native expo中制作了一个T形梳状表单,我想从表单中将值推送到Firebase中,但是它不从表单中获取相应的值并且不推送。我什至已经确定了问题,问题在于从表单中获取的值存在问题,并且这些值没有从数据库中推送到我的addDepts函数中。 这是我的表格

import React, { Component } from 'react';
import { StyleSheet, View, Button } from 'react-native';
import t from 'tcomb-form-native';
import {addDepts} from './dbServices';
import {db} from '../config/db';
var Form = t.form.Form;
var Age = t.refinement(t.Number, function(n) {
  return n >= 18;
});
Age.getValidationErrorMessage = function() {
  return 'bad age';
};

t.Number.getValidationErrorMessage = function(value) {
  if (!value) return 'empty number';
  else if (!Number.isInteger(value)) return 'bad number';
};

var Depts = t.struct({
  Name: t.String,
  Description: t.String,
  Department:t.String,
  Purpose: t.maybe(t.String),
  terms: t.Boolean,

}
);

const formStyles = {
  ...Form.stylesheet,
  formGroup: {
    normal: {
      marginBottom: 10,
    },
  },
  controlLabel: {
    normal: {
      color: 'blue',
      fontSize: 18,
      marginBottom: 7,
      fontWeight: '600',
    },
    textbox:{
       ...Form.stylesheet.textbox.normal,
                height: 200,
                textAlignVertical: 'top',
    },
    // the style applied when a validation error occours

    error: {
      color: 'red',
      fontSize: 18,
      marginBottom: 7,
      fontWeight: '600',
    },
  },
};

var options = {
  order: ['Name', 'Department','Description', 'Purpose', 'terms'],
  fields: {
    Name: {
       label: 'Department',
      placeholder: 'Enter department name',
      error: 'filed cannot be empty',
    },
        Description: {
           label: 'Description',
      placeholder: 'Department Details',
      error: 'filed cannot be empty',
    },
            Department: {
               label: 'Type',
      placeholder: 'Respective Department Type (MS/BS)',
      error: 'filed cannot be empty',
    },
    Purpose: {
      type: 'textarea',
      placeholder: 'Reason of creation',
    },
    terms: {
      label: 'Agree to Terms',
    },
  },
  stylesheet: formStyles,
};

export default class AddDept extends Component {
  handleSubmit = () => {
    var value1 = this._form.getValue();
    //this.handleSubmit=this.handleSubmit.bind(this);
    //addDepts(this.state.value1);
    //console.log('value: ', value);


      addDepts(value1.Name,value1.Description,value1.Department,value1.Purpose);

  };

  render() {
    return (
      <View style={styles.container}>
        <Form ref={c => (this._form = c)} type={Depts} options={options} />
        <Button title="Submit!" onPress={this.handleSubmit} />
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    justifyContent: 'center',
    marginTop: 50,
    padding: 20,
    backgroundColor: '#ffffff',
  },
});

这是从

形式获取值的方法
export const addDepts = (name,description,department,purpose) => {

    //console.log(name);


    db.database().ref('/custsf').push({
      name,
      description,
      department,
      purpose

      }).then((data)=>{
        //success callback
        console.log('data ' , data)
      }).catch((error)=>{
        //error callback
        console.log('error ' , error)
      });



};

0 个答案:

没有答案