爲什麼redux形式返回字符串而不是對象？

我正在嘗試訪問我的redux表單上的觸摸屬性，但由於某些原因，當我打印字段道具時，我只使用值而不是對象。我錯過了什麼？爲什麼redux形式返回字符串而不是對象？

import { reduxForm, Field } from 'redux-form'; 

render() { 
    const { fields: { email, phone }, handleSubmit } = this.props; 
    console.log(email) //prints just the value "email" instead of the field object with the touched method, etc. When I do console.log(email.touched) I get undefined error. 
    return (
    <form onSubmit={handleSubmit(this.onSubmit)}> 
     <Field name="email" component="input" type="email" { ...email } /> 
     <Field name="phone" component="input" type="number" { ...phone } />  
    </form> 
); 


} 


export default ReduxFormTest = reduxForm({ 
    form: 'uniqueForm', 
    fields: ['email', 'phone'] 
})(TestClass);

來源

2017-02-20 joethemow

redux-form從v5到v6發生了突破性的變化。以前，你可以做一些類似於你必須訪問的東西。如果你想做類似的事情來查看字段是否有錯誤，你需要創建自己的組件來傳遞給redux-form的Field組件。

您的自定義組件

const CustomComponent = function(field) { 
    return (
    <div> 
     <input 
     type={field.type} 
     {...field.input} 
     /> 
     {field.meta.touched && field.meta.error && <div className='error'>{field.meta.error}</div>} 
    </div> 
) 
}

然後用它與字段組件

<Field name="my-prop" component={CustomComponent} />

而且看一看遷移guide，希望這有助於！

來源

2017-02-20 23:12:23

這是有效的，唯一的問題是，當我在輸入中輸入一個字符時，它變爲非活動狀態，我必須再次單擊以繼續輸入。 – joethemow

我看到你編輯了field.meta.touched行，但我還沒有添加，所以問題不在於此。 – joethemow

上述問題只發生在我嘗試輸入的第一個字段中。 – joethemow

您正在混淆v5語法與v6語法。在v6中，您的裝飾表單組件不再通過this.props.fields。重新閱讀遷移指南，就像@ tyler-iguchi說的那樣。

來源

2017-02-21 18:31:34

爲什麼redux形式返回字符串而不是對象？

回答

相關問題