Reactjs 尝试将Storybook与react admin一起使用时出错；useField必须在a<；表格>；“组件”；

正在与react admin一起使用Storybook。我已经成功地将它用于react和material ui组件，但当我添加TextInput时，我得到了以下错误：“useField必须在组件内部使用。因此，我将TextInput包装在SimpleForm组件中，并得到了第二个错误：“无法读取未定义的属性‘历史记录’”

这超出了我目前的知识范围，我感到很沮丧。我确信这是一个简单的解决方案，我应该能够使用react admin的Storybook。有人能告诉我这个秘密吗？这是我目前的简单故事：

import React from 'react';
import { SimpleForm, TextInput, required } from 'react-admin';
import { Button, Typography, Card, CardContent } from '@material-ui/core';

export default {
  title: 'Sources',
};

export const TestSource = () => {
  return (
    <SimpleForm>
      <TextInput
        source="test" label="Source Name" validate={required()} fullWidth margin="none"
        validate={required()}
      />
    </SimpleForm>
  )
}

从“React”导入React；
从“react admin”导入{SimpleForm，TextInput，required}；
从“@material ui/core”导入{按钮、排版、卡片、卡片内容}；
导出默认值{
标题：'来源'，
};
export const TestSource=（）=>{
返回(
)
}

任何帮助都将不胜感激

更新： 多亏了下面的@gstvg，添加Admin标签确实产生了一些效果。我不知道如何使它更有用（在浏览器中使用应用程序所做的工作几乎与在storybook中模拟一个表单所做的工作一样多，但也许我还没有得到它

下面是新代码（必须为Admin添加一个dataProvider道具）和我看到的（至少我看到了一些东西，但表单是重复的，不确定它是否正确显示）：

返回(
大多数react admin组件都希望其他react admin父组件传递道具

TextInput需要的道具：


通过SimpleForm：


在这种情况下，TextInput需要一个SimpleForm父级（或TabbedForm、Filter等），就像您所做的那样，SimpleForm通常需要一个编辑或创建父级

考虑到你面临的错误，它们似乎与上面定义的预期缺少的道具无关，因此它们可能是由于超出了某个复杂的挂钩范围或类似的范围而发生的，所以可能只是传递道具不起作用

您可以尝试自己传递道具，也可以将整个故事书嵌入到管理员中，如下所示：


更新您的调查结果：

我发现最基本的设置是：

import { Admin, Resource, Layout, SimpleForm, TextInput, required } from 'react-admin'

const NoLayout = props => (
    <Layout
        appBar={"span"}
        sideBar={"span"}
        menu={"span"}
        {...props}
    />
)

const Dashboard = props => (
    <SimpleForm>
        <TextInput
            source="test" label="Source Name" validate={required()} fullWidth margin="none"
            validate={required()}
        />
        <TextInput
            source="test2" label="Next Field" validate={required()} fullWidth margin="none"
            validate={required()}
        />
    </SimpleForm>
)

const App = () => {

    return (
        <Admin dataProvider={{}} menu={"span"} dashboard={Dashboard} layout={NoLayout}>
            <Resource name="test"/>
        </Admin>
    )
}

import{Admin，Resource，Layout，SimpleForm，TextInput，required}来自'react Admin'
const NoLayout=道具=>(
)
const Dashboard=props=>(
)
常量应用=（）=>{
返回(
)
}

你甚至不需要一个真正的数据提供者。资源是为react-admin提供的，而不是抱怨一个空的管理员。另外，我区分了输入源，两者相等，编辑一个输入会改变两者的值，我认为这不是你想要的。
大多数react-admin组件都希望其他react-admin父组件传递道具

TextInput需要的道具：


通过SimpleForm：


在这种情况下，TextInput需要一个SimpleForm父级（或TabbedForm、Filter等），就像您所做的那样，SimpleForm通常需要一个编辑或创建父级

考虑到你面临的错误，它们似乎与上面定义的预期缺少的道具无关，因此它们可能是由于超出了某个复杂的挂钩范围或类似的范围而发生的，所以可能只是传递道具不起作用

您可以尝试自己传递道具，也可以将整个故事书嵌入到管理员中，如下所示：


更新您的调查结果：

我发现最基本的设置是：

import { Admin, Resource, Layout, SimpleForm, TextInput, required } from 'react-admin'

const NoLayout = props => (
    <Layout
        appBar={"span"}
        sideBar={"span"}
        menu={"span"}
        {...props}
    />
)

const Dashboard = props => (
    <SimpleForm>
        <TextInput
            source="test" label="Source Name" validate={required()} fullWidth margin="none"
            validate={required()}
        />
        <TextInput
            source="test2" label="Next Field" validate={required()} fullWidth margin="none"
            validate={required()}
        />
    </SimpleForm>
)

const App = () => {

    return (
        <Admin dataProvider={{}} menu={"span"} dashboard={Dashboard} layout={NoLayout}>
            <Resource name="test"/>
        </Admin>
    )
}

import{Admin，Resource，Layout，SimpleForm，TextInput，required}来自'react Admin'
const NoLayout=道具=>(
)
const Dashboard=props=>(
)
常量应用=（）=>{
返回(
)
}

你甚至不需要一个真正的数据提供者。这个资源是为react admin提供的，它不会抱怨一个空的管理员。另外，我区分了不同的输入源，两者都是相等的，编辑一个输入会改变两者的值，我想这不是你想要的。
谢谢。是的，添加admin确实会给出一些结果，但仍然试图弄清楚它是否值得使用react admin的storybook。请参阅上面的更新。谢谢。是的，添加admin确实会产生一些结果，但仍在尝试找出是否值得使用react admin的storybook。请参阅上面的更新。我使用可能的解决方案编辑答案我使用可能的解决方案编辑答案