我有一个redux表单,在提交时会导致整个浏览器页面刷新,这是不希望的......
我在这里做错了什么导致页面在提交时刷新?谢谢!
Rate.js
import React from 'react';
import RateForm from '../../components/rate/RateForm';
class Rate extends React.Component {
handleSubmit(data) {
alert('x')
console.log('handleSubmit');
console.log(data);
}
render() {
const fields = [
{
name: 'execution',
type: 'select',
options: [
{ label: '5', value: '5' },
],
},
]
return (
<div>
<RateForm fields={fields} handleSubmit={this.handleSubmit.bind(this)} />
</div>
)
}
}
export default Rate;
RateForm.js
import React from 'react';
import { Field, reduxForm } from 'redux-form';
const renderField = ({ input, field }) => {
const { type, placeholder } = field
if (type === 'text' || type === 'email' || type === 'number' || type === 'checkbox') {
return <input {...input} placeholder={placeholder} type={type} />
} else if (type === 'select') {
const { options } = field
return (
<div>
<label>{field.name}</label>
<select name={field.name} onChange={input.onChange}>
{options.map((option, index) => {
return <option key={index} value={option.value}>{option.label}</option>
})}
</select>
</div>
)
} else {
return <div>Type not supported.</div>
}
}
class RateForm extends React.Component {
render() {
return (
<form onSubmit={this.props.handleSubmit}>
{this.props.fields.map(field => (
<div key={field.name}>
<Field
name={field.name}
component={renderField}
field={field}
/>
</div>
))}
<button type="submit">Submit</button>
</form>
)
}
}
RateForm = reduxForm({
form: 'rateForm'
})(RateForm);
export default RateForm;
答案 0 :(得分:3)
您需要将handleSubmit
函数作为处理程序传递给RateForm
组件,引用名称为onSubmit
。
使用此
<RateForm fields={fields} onSubmit={this.handleSubmit.bind(this)} />
答案 1 :(得分:2)
内部 File sdcard = Environment.getExternalStorageDirectory();
//Get the text file
File file = new File(sdcard, "data.txt");
//Read text from file
StringBuilder text = new StringBuilder();
try {
BufferedReader br = new BufferedReader(new FileReader(file));
String line;
while ((line = br.readLine()) != null) {
text.append(line);
text.append('\n');
}
Log.d("Activity","Final Text----->"+text);
br.close();
} catch (IOException e) {
e.printStackTrace();
//You'll need to add proper error handling here
}
方法:
render