我想在纯
JavaScript中创建一个React Native组件,由其他组件(如TouchableOpacity和Text)组成.我的应用程序中有几个按钮是由两个组件组成的,所以我认为学习如何创建我自己的组件以更好的代码重用是很好的.
完成的组件应该看起来或多或少这样：
<Button> Tap me! </Button>
这是迄今为止为组件制作的代码：
class Button extends Component {
render () {
<TouchableOpacity style={styles.button}>
<Text style={styles.textButton}>
</Text>
</TouchableOpacity>
}
};
但是,我不知道如何使用Tap我！我的组件中的内部小孩文本,我不知道如何使我的组件接受自定义道具和TouchableOpacity和文本道具.
PS：我知道这里有一些React Native组件,但是我更喜欢创建自己的组件,以便学习如何构建这种定制组件.此外,React Native是非常棒的,但是我无法在他们的文档中找到如何构建这样的东西,我认为对于从React开始的人来说,这是一个非常有趣的练习.
您可以通过this.props.children访问内部文本,您可以手动(通过this.props)或使用…运算符传递属性.
更多的内容在react.js文档中进行了描述(注意 – 不是React Native文档！).文档中最相关的部分是：
更多的内容在react.js文档中进行了描述(注意 – 不是React Native文档！).文档中最相关的部分是：
> http://facebook.github.io/react/docs/multiple-components.html
> https://facebook.github.io/react/docs/components-and-props.html
它是React Native文档的一般方法,而不是描述所有反应概念,它们仅描述了React Native部分,并且实际概念在React的Web /原始版本中描述.
