2017-07-01 18 views
3

私はプロジェクトのすべてのフォームに対してReduxフォームモジュールを使用しています。私はコンポーネントの小道具に基づいてバリデーションを作成したいと思います。すべての行にいくつかのフィールドがあるテーブルがあります。 The table 最初のフィールドは、ストアから来たすべての製品のドロップダウンです。すべての製品に利用可能な数量があり、フィールド数量が使用可能数量を超える場合、Reduxフォームは特定の行に対してエラーを返す必要があります。それは現在の小道具を見ることができないので、私はvalidate機能で、テーブルの検証を行うことができない理由があるReduxフォームフィールド配列検証

reduxForm({ 
    validate, 
    form: 'theNameOfTheForm' 
}) 

:私はreduxForm方法で渡された検証機能でそれを行うことはできません(どのように私がそれを行うことができる方法を見つけませんでした)。私はFieldArrayコンポーネントへの小道具としてvalidate関数を渡すことにしました:私は、コンポーネントの小道具にアクセスすることができますvalidate方法から

// some methods 

validate(values) { 
    // some validation code 
} 

render() { 
    return (
     <FieldArray validate={this.validate} /> 
    ) 
} 

が、エラーがfield小道具によって受信されないものは何でも私は、このメソッドから返さcomponent小道具として<FieldArray />に渡されたコンポーネント内にあります。

return 'Some error message'; 

return ['Some error message']; 

return { 
    products: 'Some error message' 
}; 

return { 
    products: ['Some error message'] 
}; 

<FieldArray validate={this.validate} component={FieldArrayComponent} /> 

const FieldArrayComponent = ({ field, meta }) => {}; 

どうすれば検証できますか?私は何か間違っているのですか?どのように私は検証を行うことができます別の方法はありますか?

答えて

1

HOC(上位コンポーネント)を使用している場合は、コンポーネントのpropsをvalidate関数に渡し、メインのvalidate関数で検証します(コンポーネントにメソッドを作成してFieldArrayコンポーネントに渡す必要はありません) 。コンポーネントの小道具は、2番目のパラメータとして検証関数に渡され

export default connect(
    mapStateToProps, 
    mapDispatchToProps 
)(
    reduxForm({ 
    validate, 
    form: 'ExampleForm' 
    })(ExampleForm) 
); 

const validate = (values, props) => { 
    const errors = {}; 

    return errors; 
}; 
ただ、このようなコンポーネントをエクスポート
関連する問題