React，带有打字稿的观察者无状态组件

Question

我在使用带有 TypeScript 的 React 时遇到了一些问题，现在我坚持让无状态组件成为观察者。顺便说一句，我正在使用 MobX。

无状态组件：

const TaskItem: React.SFC<{task: Task, deleteTask: (e:any) => void}> = (props) => (
        <li onClick={ props.deleteTask }>{ props.task.name }</li>
);

下面的代码给出了将 ClassicComponent 分配给 StatelessComponent 的类型不匹配，而我无处可去解决它。

错误： [ts] 键入'ClassicComponentClass void; }>' 不可分配给类型 'StatelessComponent void; }>'。

const TaskItem: React.SFC<{task: Task, deleteTask: (e:any) => void}> = observer((props) => (
        <li onClick={ props.deleteTask }>{ props.task.name }</li>
));

如何让无状态组件成为观察者？有没有“更漂亮”的方式来写这个？

Answer 1

看起来这样可行：

const App = observer((props: {test: string}) => 
    <div>{props.test}</div>
);

ReactDOM.render(<App test="sdsdfsddddddddddddddddddf" />
    ,document.getElementById('root'));