Question

我目前正在使用类型化的React（TSX）和mobx进行状态管理。

我能够构建一个同时使用observer和inject装饰器的组件。但我无法构建一个没有观察者使用注入的组件。

这会传递打字稿编译器

export const DealershipBreadCrumb = inject("appStore")(observer((props: Props) => {
    const {appStore} = props;
    const dealership = appStore.getSelectedDealership();
    return (
          <div className="filter__container filter__group">
            <a className="filter__link" href={`cars?q=${appStore.searchResults.searchQuery}`}>
              <span className="filter__text">{dealership.name}</span>
            </a>
          </div>
      )
    }))

然而这失败了

export const DealershipBreadCrumb = inject("appStore")((props: Props) => {

出现以下错误消息

[ts] Argument of type '(props: Props) => Element' is not assignable to parameter of type 'ComponentClass<{}>'.
   Type '(props: Props) => Element' provides no match for the signature 'new (props?: {}, context?: any): Component<{}, ComponentState>'

请协助我查看此错误消息的正面和反面。我敢打赌，这些打字已经过时了。或者在没有观察者的情况下使用注入实际上是无效的组合。

Answer 1

我认为您的错误来自于此：((props: Props)... 当使用注入方式时，我相信它正在期待一个功能，试试这样使用它：
export const DealershipBreadCrumb = inject('SystemDataStore')((props => {

顺便说一句，如果你想在没有观察者的情况下使用注入，它会注入该商店的最后一个值，但它不会注意到任何值的变化。

没有观察者

1 个答案: