簡體   English   中英

如何將自定義(redux-form's Field)輸入道具綁定到記錄?

[英]How to bind custom (redux-form's Field) input prop to record?

我正在通過 redux-form 的字段創建自定義輸入。 我使用“名稱”道具來匹配我想要綁定的記錄屬性,但是當我創建或編輯記錄時,post 參數既不顯示輸入值也不顯示屬性名稱。

我已經以多種方式嘗試了關於自定義輸入的 react-admin 教程,但沒有結果。

環境

React-admin 版本:2.7.2 React 版本:16.8.3 瀏覽器:Chrome/Firefox

// tariff.js

import TextField from '@material-ui/core/TextField';
import { Field } from 'redux-form';

const renderTextField = ({ input, label, meta: { touched, error }, ...custom }) => {
    const { defvalue } = custom;

    return (
        <TextField
            label={label}
            error={!!(touched && error)}
            helperText={touched && error}
            {...input}
            {...custom}
            value={defvalue}
        />
    )
};

class Tariff extends React.Component {
    state = {
        tariffs: [],
        selectedTariff: {}
    }

    // other methods...

    render() {
        const { tariffs, selectedTariff } = this.state;

        return (
            <React.Fragment>
                <Autocomplete suggestions={tariffs}
                    label={'Elija una tarifa'}
                    onChange={this.onTariffSelected}
                    defaultValue={''} />
                <Field name="tariff" component={renderTextField} label="Tarifa" defvalue={selectedTariff.amount || 0} />
            </React.Fragment>
        )
    }
}

// Customer.js

export const CustomerCreate = (props) => (
    <Create title="Crear Alumno" {...props}>
        <SimpleForm defaultValue={{status: true, identification_type: 'DNI'}}>
            <TextInput label="Nombre" source="name" validate={required()} 
            <Tariff/>
        </SimpleForm>
    </Create>

自定義輸入道具“名稱”(通過 redux-form 字段)在保存或編輯時添加到記錄中。

<Field name="tariff" defvalue={0}}/>

我希望在 POST/PUT 記錄上有“關稅”:0 在他的身上。

解決方案:

只需將具有 redux 的 Field 的組件連接到 redux 存儲:

export default connect(null, null)(Tariff);

您應該以 redux 形式使用 initialValues。 看到這里

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM