带有表单参数的 react-admin 重定向按钮

如何解决带有表单参数的 react-admin 重定向按钮

我正在尝试在 react admin 中创建一个简单的表单，用于收集国家和语言的用户选项然后使用由用户选择构建的链接重定向到第 3 方网站。

// in LocationInput.js
import Select from '@material-ui/core/Select';
import MenuItem from '@material-ui/core/MenuItem';
import { useInput } from 'react-admin';

const LocationInput = props => {
    const {
        input,Meta: { touched,error }
    } = useInput(props);

    return (
        <Select
            label="Location"
            {...input}
        >
            <MenuItem value="GB">United Kingdom</MenuItem>
            <MenuItem value="SE">Sweden</MenuItem>
        </Select>
            <Select
            label="Language"
            {...input}
        >
            <MenuItem value="en_UK">English</MenuItem>
            <MenuItem value="sv_SE">Swedish</MenuItem>
        </Select>
     
    );
};
export default LocationInput;

const LocationEdit = props => (
    <Edit {...props}>
        <SimpleForm>
            <LocationInput
                source="location"
               
            />
**how do I add a button here to redirect to a link having parameters chosen by the user
ex: https://cnn.com/countryselected/languageselected. (the link is outside of my app in a 3rd party website)**
        </SimpleForm>
    </Edit>

稍后编辑。

我尝试使用官方文档中描述的重定向功能：https://marmelab.com/react-admin/CreateEdit.html#redirection-after-submission

然而，这似乎只是为了在内部重定向到 react-admin 路由，而不是重定向到根据用户在我的创建表单中输入构建的 URL 的外部网站。

const redirect = 'https://cnn.com';
...
const LocationEdit = props => (
    <Edit {...props}>
        <SimpleForm redirect={redirect}>
            <LocationInput
                source="location"
               
            />

解决方法

<SimpleForm> 用于编辑记录。在此示例中，您似乎并未尝试保留更改，而只是为了收集数据以稍后重定向用户。在这种情况下，我不会使用 <SimpleForm>，而是使用 react-final-form 的 <Form>（参见 https://final-form.org/docs/react-final-form/api/Form）。

至于 redirect 属性，它接受一个函数值，所以你通常可以这样写：

const redirect = (basePath,id,data) => `'https://cnn.com/location/${data.location}`;
...
const LocationEdit = props => (
    <Edit {...props}>
        <SimpleForm redirect={redirect}>