我正在尝试创建具有redux形式的HOC模板,但是我遇到了错误。
我想击中组件将接收道具,以便在编辑模式下用api中的值填充redux表单。为此,我需要我无法获得的表单值。
private void EnterTextToolStripMenuItem_Click(object sender, EventArgs e)
{
rtbText.Text += "Enter this Text";
}
我遇到错误
import React, { Component } from 'react'
import { connect } from 'react-redux'
import { compose } from 'redux'
import { reduxForm, getFormValues } from 'redux-form'
import { renderOptions } from './../common/formatData'
import { getQuestions, initializeSurveys, submitEligibilityCheck } from '../../actions/surveysAction'
// import { submitEligibilityCheck } from '../../actions/eligibilityCheckAction'
let EligibilityWrapper = (WrappedComponent) => {
return class extends Component {
constructor(props) {
super(props)
this.state = {
page: 1,
check: true,
refs: [],
start_time: 0
}
this.formSubmit = this.formSubmit.bind(this)
this.renderQuestions = this.renderQuestions.bind(this)
this.defineRefs = this.defineRefs.bind(this)
}
componentWillReceiveProps(nextProps) {
let obj = {}
let scrollToElement = 0;
if (this.state.check && nextProps.survey_data) {
nextProps.survey_data.section.map((item, i) => {
let question_code = item.question_code
let answer = item.answer ? item.answer : null
obj[question_code] = answer
if (item.answer) {
scrollToElement = item.question_code
}
})
if (scrollToElement != 0 && screen.width >= 1041) {
let element = this.state.refs.find((ele) => ele.id == scrollToElement)
element.scrollIntoView({ behavior: 'smooth' })
}
this.props.initialize(obj)
this.setState({ check: false })
}
}
defineRefs(domElement) {
if (domElement) {
this.setState({ refs: this.state.refs.push(domElement) })
}
}
componentDidMount() {
this.setState({ start_time: new Date() })
}
formSubmit(values, tab) {
let obj = {}
let count = 0
let is_draft = true
let attempt_id = this.props.survey_data[tab].attempt_id
let survey_section = this.props.survey_data[tab].section;
for (var property in values) {
if (values.hasOwnProperty(property)) {
if (values[property] && !_.isEmpty(values[property])) {
count++
obj[property] = { answer_text: values[property] }
Object.assign({}, obj, obj[property])
}
}
}
if ((Object.keys(obj).length == survey_section.length) && this.props.survey_data[tab] .is_draft == null) {
// making is_draft true / false based on user input and skipped count
is_draft = false
}
let stop_time = new Date()
let time_taken = ((stop_time.getTime() - this.state.start_time.getTime()) / 1000).toFixed(0)
this.props.submitEligibilityCheck(obj, attempt_id, is_draft, time_taken, Object.keys(obj) .length)
}
renderQuestions(questions) {
if (questions && questions.length > 0) {
return questions.map((item, i) => {
return (
<div className='c-s-ques' key={i} ref={this.defineRefs} id={item.question_code}>
{(<div>
{item.default_text && (
<label className='main-heading'>
<b>{item.default_text}</b>
</label>
)}
<p>{item.question_text}</p>
{renderOptions(item)}
</div>
)}
</div>
)
})
}
}
render() {
return (
<WrappedComponent {...this.props}
formSubmit={this.formSubmit}
renderQuestions={this.renderQuestions}
/>
)
}
}
}
EligibilityWrapper = reduxForm({
destroyOnUnmount: false
})(EligibilityWrapper)
const mapStateToProps = state => ({
survey_data: state.surveysReducer.data.survey_section,
// WrappedComponent: state.form.WrappedComponent
})
const composedEligibilityWrapper = compose(
connect(mapStateToProps, { getQuestions, initializeSurveys, submitEligibilityCheck }), EligibilityWrapper
)
export default composedEligibilityWrapper
我想要state.form.formname中的表单值