2016-11-29 7 views
0

Я пытаюсь сделать простой вид рендеринг, но я всегда получаю эту ошибкуперевождите форму v6, неизвестен реквизит сообщение

Unknown props `input`, `meta` on <input> tag.

Я исследовал этот вопрос, прежде чем и не нашел ничего, кроме GitHub дискуссии, которые буквально бросают около 4 или 5 различных реализаций того, как это должно быть сделано без консенсуса, и я также следил за реализацией документов v6 таким образом, но безрезультатно. какие-либо предложения?

Я использую v6.2.0, самую последнюю версию во время отправки этого сообщения.

Я непосредственно копирую вставку из примера здесь, http://redux-form.com/6.0.0-alpha.15/examples/syncValidation/, все еще получаю сообщение об ошибке. (Я прикрепил свой код ниже)

import React from 'react' 
import { Field, reduxForm } from 'redux-form' 

const validate = values => { 
    const errors = {} 
    if (!values.username) { 
    errors.username = 'Required' 
    } else if (values.username.length > 15) { 
    errors.username = 'Must be 15 characters or less' 
    } 
    if (!values.email) { 
    errors.email = 'Required' 
    } else if (!/^[A-Z0-9._%+-][email protected][A-Z0-9.-]+\.[A-Z]{2,4}$/i.test(values.email)) { 
    errors.email = 'Invalid email address' 
    } 
    if (!values.age) { 
    errors.age = 'Required' 
    } else if (isNaN(Number(values.age))) { 
    errors.age = 'Must be a number' 
    } else if (Number(values.age) < 18) { 
    errors.age = 'Sorry, you must be at least 18 years old' 
    } 
    return errors 
} 

const renderField = props => (
    <div> 
    <label>{props.placeholder}</label> 
    <div> 
     <input {...props}/> 
     {props.touched && props.error && <span>{props.error}</span>} 
    </div> 
    </div> 
) 

const SyncValidationForm = (props) => { 
    const { handleSubmit, pristine, reset, submitting } = props 
    return (
    <form onSubmit={handleSubmit}> 
     <Field name="username" type="text" component={renderField} placeholder="Username"/> 
     <Field name="email" type="email" component={renderField} placeholder="Email"/> 
     <Field name="age" type="number" component={renderField} placeholder="Age"/> 
     <div> 
     <button type="submit" disabled={submitting}>Submit</button> 
     <button type="button" disabled={pristine || submitting} onClick={reset}>Clear Values</button> 
     </div> 
    </form> 
) 
} 

export default reduxForm({ 
    form: 'syncValidation', // a unique identifier for this form 
    validate     // <--- validation function given to redux-form 
})(SyncValidationForm) 
+0

console.log (this.props); в верхней части вашего рендера и опубликовать результат – Chase

+0

Объект {anyTouched: false, asyncValidating: false, dirty: false, error: undefined, form: "syncValidation" ...} –

+0

Я также пробовал но это не регистрирует никаких изменений во вводе (не может видеть, что вы печатаете), и никаких ошибок или проверки проверки не происходит –

ответ

1

Поскольку вы используете пример кода 6.0.0-alpha.15 версии.

Внедрение 6.2.0 example должно исправить ошибки (, если вы используете redux-form v6.2.0).

Credits.

+1

Да. Это верно. –