休息时的管理员：我们如何在两者之间保留查询参数

Question

我们需要 3 个不同的菜单项对同一资源 ("assets") 执行 CRUD 操作，但只有 category_id 在 all[=49 上不同=] CRUD 操作（直到您再次按下不同的菜单项）。

为了做到这一点，我们引入了一个查询参数，称为 kind，这是这 3 个链接之间唯一的实际区别：

<MenuItemLink to={{ pathname: '/assets', search: stringify({page: 1, perPage: 25}), }} primaryText="Assets" onClick={onMenuTap} leftIcon={<AssetsIcon />} /> <MenuItemLink to={{ pathname: '/assets', search: stringify({ page: 1, perPage: 25, kind: 'printers' }), }} primaryText="Printers" onClick={onMenuTap} leftIcon={<AssetsIcon />} /> <MenuItemLink to={{ pathname: '/assets', search: stringify({ page: 1, perPage: 25, kind: 'vehicles' }), }} primaryText="Vehicles" onClick={onMenuTap} leftIcon={<AssetsIcon />} />

通过以下代码，List 仅获取这些资产的记录：

// 注意：'parsedKind' 是用前面的代码解析的 grom 查询参数，它得到以下值之一：'' OR 'printers' OR 'vehicles'

<List title={<TitleList location={props.location} />} {...props} filters={<AssetFilter location={props.location} key={parsedKind} />} perPage={15} filter={{cat_id: dbIds[parsedKind]}} sort={{field: 'name', order: 'ASC'}} actions={<OurCustomListActions parsedKind={parsedKind} {...props} />} key={parsedKind} >

为了使其正常工作，我们必须使用自定义按钮来自定义 "actions"，以便 parsedKind 继续执行。例如，CreateButton 现在需要一个属性 ourQuery:

<FlatButton primary label={label && translate(label)} icon={<ContentAdd />} containerElement={<Link to={`${basePath}/create?${ourQuery}`} />} style={styles.flat} />

我这里有 3 个问题：

这是一项繁琐的工作（所有按钮都已自定义），我想知道是否有其他解决方案可以满足此需求。

不过，"SaveButton" 还是让人头疼，因为它使用了来自 props 的 handleSubmitWithRedirect 函数，参数只是视图的名称（ 'list' 例如）。那么如何在最后的 URL 上添加查询参数呢？我在 2 秒后 (window.location.hash = window.location.hash + '?' + this.props.ourQuery;) 使用了一个丑陋的 setTimeout 来执行此操作，但显然这是非常错误的。 DeleteButton 也有问题，因为它重定向到子视图。

使用上述方法，我在列表分页中得到 NaN-NaN from 19。为什么？这也能以某种方式解决吗？

谢谢！

Answer 1

所以我认为您最好的选择是简单地创建三个资源：Assets、Vehicles 和 Printers。与在您的 restClient/dataProvider 中相比，创建逻辑以将这三个资源路由到具有正确 parameter 的 assets 端点。我简单的中间件就够了，在行里掉点东西：

// MyAssetResourceMiddleware.js
export default restClient => (type, resource, params) => {
     switch(resource){
        case 'Assets':
        case 'Vehicles':
        case 'Printers':
          return restClient(type,'assets',{...params,kind:resource});
        default: 
          return restClient(type,resource,params);
     }    
}

并用它包裹你的供应商

<Admin dataProvider={MyAssetResourceMiddleware(dataProvider)} .../>

休息时的管理员：我们如何在两者之间保留查询参数

Admin on Rest: How can we preserve a query param between

admin-on-rest