提供给“ReactiveComponent”的“object”,预期的“function”
`object` supplied to `ReactiveComponent`, expected `function`
我在尝试对搜索栏使用 ReactiveSearch 时遇到此错误。这就是我初始化它的方式:
render() {
const { tenantConfig, size, componentId } = this.props;
return (
<ReactiveComponent
componentId={componentId}
defaultQuery={this.defaultQuery}
>
<SearchDropdownDashboard
size={size}
handleSearchDashboard={this.handleSearchDashboard}
fetching={this.state.fetching}
tenantConfig={tenantConfig}
/>
</ReactiveComponent>
);
}
这是传入的函数:
defaultQuery = () => {
const { dashboardText } = this.state;
const { mustNotObj } = this.props;
let obj;
obj = {
query: {
bool: {
must_not: mustNotObj,
must: multiMatchSearch(dashboardText)
}
},
from: 0,
size: 20
};
return obj;
};
关于我在这里做错了什么有什么建议吗?该函数似乎已正确传递给组件。
如果您正在使用 v3
,那是因为 API 中引入了最近的更改。您将需要使用 render
prop 或 React render Pattern,如下例所示。
您可以在此处查看文档:https://opensource.appbase.io/reactive-manual/advanced/reactivecomponent.html#usage-with-defaultquery。
我已经在两个版本上创建了 ReactiveComponent 的使用示例:
v3
: https://codesandbox.io/s/serene-ritchie-rjo3m
v2
: https://codesandbox.io/s/tender-ramanujan-f3g31
希望对您有所帮助!
我在尝试对搜索栏使用 ReactiveSearch 时遇到此错误。这就是我初始化它的方式:
render() {
const { tenantConfig, size, componentId } = this.props;
return (
<ReactiveComponent
componentId={componentId}
defaultQuery={this.defaultQuery}
>
<SearchDropdownDashboard
size={size}
handleSearchDashboard={this.handleSearchDashboard}
fetching={this.state.fetching}
tenantConfig={tenantConfig}
/>
</ReactiveComponent>
);
}
这是传入的函数:
defaultQuery = () => {
const { dashboardText } = this.state;
const { mustNotObj } = this.props;
let obj;
obj = {
query: {
bool: {
must_not: mustNotObj,
must: multiMatchSearch(dashboardText)
}
},
from: 0,
size: 20
};
return obj;
};
关于我在这里做错了什么有什么建议吗?该函数似乎已正确传递给组件。
如果您正在使用 v3
,那是因为 API 中引入了最近的更改。您将需要使用 render
prop 或 React render Pattern,如下例所示。
您可以在此处查看文档:https://opensource.appbase.io/reactive-manual/advanced/reactivecomponent.html#usage-with-defaultquery。
我已经在两个版本上创建了 ReactiveComponent 的使用示例:
v3
: https://codesandbox.io/s/serene-ritchie-rjo3m
v2
: https://codesandbox.io/s/tender-ramanujan-f3g31
希望对您有所帮助!