[英]Cannot read property '_root' of null in React Native when using NativeBase Toast component
[英]React Native + NativeBase Content component and Carousel (not displaying)
美好的一天,
这是我使用NativeBase组件的React Native应用程序的一个小问题。 问题在NativeBase的<Content />
组件内。 我想使用github中的<Carousel />
组件,它是react-native-carousel 。
代码如下:
index.android.js
import React, { Component } from 'react';
import {
AppRegistry,
StyleSheet,
Text,
View,
} from 'react-native';
import {
Container,
Header,
Content,
Title,
Icon,
Button,
} from 'native-base';
import Carousel from 'react-native-carousel';
import styles from './src/styles/styles';
export default class iABC extends Component {
render() {
return (
<Container>
<Header backgroundColor='#ffffff' height={50}>
<Button transparent>
<Icon name='md-menu' style={styles.header.icon} />
</Button>
<Title style={styles.header.title}>
iABC
</Title>
<Button transparent>
<Icon name='md-person' style={styles.header.icon} />
</Button>
</Header>
<Content>
<View style={styles.global.content}>
<Carousel width={375}
hideIndicators={false}
indicatorColor='#000000'
indicatorSize={25}
indicatorSpace={20}
indicatorAtBottom={true}
indicatorOffset={250}
indicatorText='>'
animate={true}
delay={2000}
loop={true}>
<View style={styles.carousel.page1}>
<Text>Page 1</Text>
</View>
<View style={styles.carousel.page1}>
<Text>Page 2</Text>
</View>
<View style={styles.carousel.page1}>
<Text>Page 3</Text>
</View>
</Carousel>
</View>
</Content>
</Container>
);
}
}
AppRegistry.registerComponent('iABC', () => iABC);
风格: carousel.js
'use strict'
import { StyleSheet } from 'react-native';
export default StyleSheet.create({
page1: {
flex: 1,
height: 150,
width: 375,
backgroundColor: '#cdcdcd',
justifyContent: 'center',
alignItems: 'center',
}
})
风格: global.js
'use strict'
import { StyleSheet } from 'react-native';
export default StyleSheet.create({
content: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
},
})
我尝试了很多事情,对转盘组件进行样式设置,给它一个单独的视图,同时对两个组件进行样式设置,但不幸的是,它不起作用。 但是,只要删除NativeBase的<Content />
组件,它就可以正常工作。 我很确定问题出在NativeBase组件上。
提前致谢。
关于本机轮播
Carousel
Carousel
呈现CarouselPager
CarouselPager
呈现RN的ScrollView
关于NativeBase Content
,它呈现RN的ScrollView
。 因此,将它包装在另一个ScrollView中是不必要的,并且会引起问题。
尝试排除NB的内容。
进一步了解NativeBase的替换组件-CheatSheet
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.