无法在使用react native的typescript中使用StatelessComponent

Question

我正在尝试扩展react-native-button库的Button组件。

使用扩展组件的类：

import { DefaultButton } from "../../support/ui/DefaultButton";

...

render() {
    const loginProps = {
            title: "login",
            style: {backgroundColor: DefaultTheme.blueColor},
            containerStyle: {backgroundColor: DefaultTheme.blueColor, flex: 0.5}
        };

    return (<DefaultButton {...loginProps}>test</DefaultButton>);
}

我的扩展组件类DefaultButton.tsx：

import React from 'react';
import { Button, IButtonProperties } from 'react-native-button';


// default button component using stateless functional component
// https://medium.com/@housecor/react-stateless-functional-components-nine-wins-you-might-have-overlooked-997b0d933dbc#.vizff8ap4
// http://donormal.com/writing/stateless-components-in-react-typescript/
const DefaultButton : React.StatelessComponent<IButtonProperties> = (props: IButtonProperties) => (
    <Button style={props.style}
            containerStyle={props.containerStyle}>
        {props.children}
    </Button>
)

export { DefaultButton };

但上面的代码会导致：

我的代码出了什么问题的任何线索？

P.S。这是我正在使用的库版本：

"react-native": "0.39.2",
"react-native-button": "1.7.1",
"typescript": "2.1.4",

Answer 1

你应该像以下一样导入Button：

从＆＃39; react-native-button＆＃39;;

导入按钮

Answer 2

你应该为Button传递“title”道具，因为它在new react native version更新了。您应该在DefaultButton组件类中创建这样的组件：

const DefaultButton : React.StatelessComponent<IButtonProperties> = (props: IButtonProperties) => (

<Button title='Button_Title'
        style={props.style}
        containerStyle={props.containerStyle}>
        {props.children}
</Button>
)

如果您要创建自己的按钮，那么您可以在任何组件中编写旧样式，如：

<DefaultButton>
  Button_Title
</DefaultButton>

但是你应该从DefaultButton访问子组件。谢谢！