reactjs - 使用带有道具的原生基本按钮
问题描述
我想创建一个可重用的按钮组件,但我遇到了一些问题。我回来了undefined is not an onject evaluting '_nativebase.stylrsheetcreate'
。我尝试破坏 onPress 和标题,但没有运气。有人可以就如何解决这个问题给出明确的解释吗?谢谢
import React from 'react';
import { View, Text, Button, StyleSheet } from 'native-base';
export const StyledButton = props => {
return (
<View style={styles.button}>
<Button
block
full
bordered
light
onPress={this.props.onPress}
>
<Text
style={{
color: '#FFFFFF',
}}
>
{this.props.title}
</Text>
{this.props.children}
</Button>
</View>
);
};
const styles = StyleSheet.create({
button: {
flex: 1,
padding: 10,
}
});
渲染
<StyledButton
title='Cancel'
onPress={this.somefunction}
/>
解决方案
删除this
使用props.someprop
import React from 'react';
import { StyleSheet } from 'react-native';
import { View, Text, Button } from 'native-base';
export const StyledButton = props => {
return (
<View style={styles.button}>
<Button block full bordered light onPress={props.onPress}>
<Text
style={{
color: '#FFFFFF',
}}>
{props.title}
</Text>
{props.children}
</Button>
</View>
);
};
const styles = StyleSheet.create({
button: {
flex: 1,
padding: 10,
}
});
推荐阅读
- c# - 无法使用 as 运算符或简单转换将列表转换或转换为另一个列表
- jquery-selectors - 在 Cypress 中优化选择器
- ffmpeg - ffmpeg 从顶部屏幕裁剪视频
- node.js - 使用 NodeJS 承诺在 DynamoDB 中创建记录
- html - 带有不可点击链接的轮播,而是点击上一个链接
- c++ - 对数字范围使用 boost
- python - 使用 selenium 遍历列表
- firebase - 删除和添加文档到 Firebase 时的时间问题
- c# - If-else 构造失败(.NET Framework)
- python - 使用 Selenium 删除 PopUp