Sibiraj PR
Sibiraj PR

Reputation: 1481

Import component not working

Custom Component

import React, { Component } from 'react'
import { Text } from 'react-native'
import { Content } from 'native-base'

export default class Login extends Component {
  render () {
    return (
      <Content>
        <Text>This is stateless Component</Text>
      </Content>
    )
  }
}

index.ios.js

import React, { Component } from 'react'
import { AppRegistry, Text, View } from 'react-native'
import { Container, Header, Title, Content } from 'native-base'
import Login from './src/components/Login'

export default class MyApp extends Component {
  render () {
    return (
      <Container>
        <Header>
          <Title>Login</Title>
        </Header>
        <Login />
      </Container>
    )
  }
}

AppRegistry.registerComponent('MyApp', () => MyApp)

Only showing header in the running App. Expected This is stateless Component is not there. Can any one look into this please?

Upvotes: 0

Views: 999

Answers (1)

Meysam Izadmehr
Meysam Izadmehr

Reputation: 3260

You can use Content component of the native-base only in the container component:

import React, { Component } from 'react'
import { Text } from 'react-native'
import { Container, Content } from 'native-base'

export default class Login extends Component {
    render () {
      return (
        <Container>
          <Content>
            <Text>This is stateless Component</Text>
          </Content>
        </Container>
     )
   }
}

Upvotes: 1

Related Questions