我是一个新手,所以我可能缺乏一些常识。现在我尝试添加一些选项到我的表,我使用选择块,如:
import {Modal, Form, DatePicker, message, Select, Input} from 'antd';
const jm1 = [
{value: '结膜无充血、水肿', label: '结膜无充血、水肿'}, {value: '充血+', label: '充血+'},
{value: '混合充血', label: '混合充血'}, {value: '睫状充血', label: '睫状充血'}, {value: '滤泡+', label: '滤泡+'},
{value: '乳头+', label: '乳头+'}
];
class Table extends React.Component {
constructor(props) {
super(props);
this.state = {
data: this.props.value
}
}
render() {
return (
<table className={styles.table} border="1">
<tr>
<th style={{width: 100}}>结膜</th>
<td>
<Select options={jm1}
onChange={this.handleValueChange.bind(this, 0, 0)} value={this.state.data[0][0]}/>
</td>
</tr>
)
}
handleValueChange(x, y, e) {
// let value = e.target.value;
let value = e === null ? '' : String(e);
let data = this.state.data;
data[x][y] = value;
this.setState({
data: data
});
const onChange = this.props.onChange;
if (onChange) {
onChange(data);
}
}
}
然而,它根本不渲染,选项只是简单地显示"我不知道如何解决这个问题,也不知道该搜索什么。如果有人能帮忙,非常感谢。没有数据
我想要成功显示选项,我排除了汉字的问题。我找过了,没有发现类似的问题。我怀疑它与我的代码的其他部分有关…
const FundusImageModal = ({
form,
data,
visible,
createLoading,
editLoading,
onCreateSubmit,
onEditSubmit,
onCancel
}) => {
const {getFieldDecorator} = form;
const handleOk = () => {
form.validateFields((err, values) => {
if (!err) {
let isValid = values.table.findIndex((value) => {
return (value[0].length + value[1].length) > 0;
});
if (isValid >= 0) {
if (data.id) {
onEditSubmit(data.id, values);
} else {
onCreateSubmit(values);
}
} else {
message.info('无法提交,至少要填写一项数据');
}
}
});
}
const disabledDate = (current) => {
return current && current >= moment().endOf('day');
}
let title = '编辑眼科检查记录';
let loading = editLoading;
if (data === undefined) {
title = '添加眼科检查记录';
loading = createLoading;
data = {
recordDate: moment().format('YYYY-MM-DD'),
table: [['', ''], ['', ''], ['', ''], ['', ''], ['', ''], ['', ''], ['', ''], ['', ''], ['', ''], ['', ''], ['', ''], ['', ''], ['', ''], ['', '']]
}
}
return (
<Modal title={title} okText="提交" cancelText="取消" destroyOnClose={true} confirmLoading={loading}
visible={visible} onOk={handleOk} onCancel={onCancel} width={900}>
<Form>
<FormItem {...formItemLayout} label="采集时间">
{getFieldDecorator('recordDate', {
initialValue: moment(data.recordDate, 'YYYY-MM-DD'),
rules: [{
required: true, message: '请选择采集时间',
}]
})(
<DatePicker disabledDate={disabledDate}/>
)}
</FormItem>
<FormItem>
{getFieldDecorator('table', {
initialValue: data.table
})(
<Table/>
)}
</FormItem>
</Form>
</Modal>
)
}
export default Form.create()(FundusImageModal);
问题已解决。我的版本不是最新的…