Hacktoberfest 2026: los issues que los mantenedores marcaron para octubre, abiertos y aptos para principiantes. Explorar issues de Hacktoberfest

TypeError: undefined is not an object (evaluating '(i === 0 ? obj : resVal)[pathArray[i]]')

Abierto
  • ¿Algo no está bien?
#142 4 comentarios 2 reacciones 0 asignados Ver en GitHub

Nadie ha tomado este issue todavía.

Evaluación

Dificultad
3/5
Tiempo estimado
1-2 días
Aptitud para principiantes
35/100
Tipo de issue
Error
Claridad
Bastante claro
Estado de actividad
Estancado
Stack tecnológico
javascript, react, react-native
Área
frontend, mobile

Línea de trabajo

Reproduce el error usando la demo de Snack enlazada y las versiones indicadas en package.json; después, inspecciona el punto de entrada handleTextInput y su interacción con los campos de texto. Compara el comportamiento con y sin validationSchema y con y sin los helpers de auto-focus. Se considera terminado cuando escribir un carácter en cada campo ya no provoca el TypeError indicado y el envío del formulario sigue funcionando.

Escrito por el modelo de indexación a partir del texto del issue.

Descripción

I'm basically using the demo Gist verbatim:

https://snack.expo.io/@almouro/react-native-formik-gist

When I type a single letter into any text field I get the error:

TypeError: undefined is not an object (evaluating '(i === 0 ? obj : resVal)[pathArray[i]]')

I tried removing validationSchema and I still got the error. Separately, I tried removing withNextInputAutoFocusForm and withNextInputAutoFocusInput, and still got the problem. It feels like a bug in handleTextInput. Maybe I'm doing something stupid in the syntax below.

From package.json:

"formik": "^2.1.4",
"react-native-formik": "^1.7.8",
"react-native-material-textfield": "^0.16.1",
"recompose": "^0.30.0",
"yup": "^0.28.3"

Code:

import React from 'react';
import { Button, ScrollView, View } from 'react-native';
import { compose } from 'recompose';
import { Formik } from 'formik';
import * as Yup from 'yup';
import {
  handleTextInput,
  withNextInputAutoFocusForm,
  withNextInputAutoFocusInput
} from 'react-native-formik';
import { OutlinedTextField } from 'react-native-material-textfield';

const MyInput = compose(
  handleTextInput,
  withNextInputAutoFocusInput
)(OutlinedTextField);
const Form = withNextInputAutoFocusForm(View);

const validationSchema = Yup.object().shape({
  country: Yup.string()
    .required('Required.')
    .length(2, 'Must be 2 letter country code.'),
});

const RegistrationForm = props => (
  <Formik
    onSubmit={values => console.log(values)}
    validationSchema={validationSchema}
  >
    {props => (
      <Form>
        <MyInput label="Country" name="country" type="name"/>
        <MyInput label="Business name" name="name" type="name"/>
        <MyInput label="Business website" name="website" type="email"/>
        <MyInput label="Business phone number" name="phone" type="digits"/>
        <MyInput label="Address line 1" name="addressLine1" type="name"/>
        <MyInput label="Address line 2" name="addressLine2" type="name"/>
        <MyInput label="City" name="city" type="name"/>
        <MyInput label="State" name="state" type="name"/>
        <MyInput label="Zip code" name="zip" type="digits"/>
        <Button onPress={props.handleSubmit} title="SUBMIT" />
      </Form>
    )}
  </Formik>
);

export default class MyScreen extends React.Component {
  render() {
    return (
      <ScrollView style={{ padding: 30 }}>
        <RegistrationForm/>
      </ScrollView>
    );
  }
}
Lenguaje dominante
JavaScript
Estrellas
397
Forks
48
Sin PR fusionados en 30 d

Preparar el entorno

Este proyecto no incluye contenedor de desarrollo, Dockerfile ni guía de contribución, así que la configuración corre por tu cuenta: empieza por su README y consulta nuestra guía para la primera contribución para los pasos generales.

Primeros pasos

  1. Lee el issue completo y luego la guía de contribución del proyecto.
  2. Comenta en el issue que vas a ocuparte — evita que dos personas hagan lo mismo.
  3. Haz un fork del repositorio y trabaja en una rama.
  4. Abre un pull request que haga referencia al número del issue.

Más de bamlab/react-native-formik

Todos los issues de bamlab/react-native-formik

Issues similares

Más issues de JavaScript

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.