0

I am new on react native and sorry if this is a stupid question. I am trying the button elements from this website: https://reactnativeelements.com/docs/button/

But when I run it I got this error. I already tried some of the answers on this website but still got no luck. I hope someone can help me with this.

Error

App.js

import React from 'react';
 import type {Node} from 'react';
 import {
   SafeAreaView,
   ScrollView,
   StatusBar,
   StyleSheet,
   Text,
   useColorScheme,
   View,
 } from 'react-native';
 
 import {
   Colors,
   DebugInstructions,
   Header,
   LearnMoreLinks,
   ReloadInstructions,
 } from 'react-native/Libraries/NewAppScreen';
 
 import HomeView from './Homepage.js';
 
 const App = () => {
   return (
     <HomeView />
   )
 };export default App

Homepage.js

import React from 'react';
import type Node from 'react';
import {
   SafeAreaView,
   ScrollView,
   StatusBar,
   StyleSheet,
   Text,
   useColorScheme,
   View,
 } from 'react-native';
 
import {
   Colors,
   DebugInstructions,
   Header,
   LearnMoreLinks,
   ReloadInstructions,
 } from 'react-native/Libraries/NewAppScreen';

import Button from 'react-native-elements';
import Icon from 'react-native-vector-icons';

const App = () => {
    return (
        <div>
        <Button
        title="Solid Button"
        />

        <Button
        title="Outline button"
        type="outline"
        />

        <Button
        title="Clear button"
        type="clear"
        />

        <Button
        icon={
            <Icon
            name="arrow-right"
            size={15}
            color="white"
            />
        }
        title="Button with icon component"
        />

        <Button
        icon={{
            name: "arrow-right",
            size: 15,
            color: "white"
        }}
        title="Button with icon object"
        />

        <Button
        icon={
            <Icon
            name="arrow-right"
            size={15}
            color="white"
            />
        }
        iconRight
        title="Button with right icon"
        />

        <Button
        title="Loading button"
        loading
        />
        </div>
    );
}
 
 const styles = StyleSheet.create({

});
 
 export default App;
0

1 Answer 1

1

This should be

Homepage.js

import React from 'react';
import type Node from 'react';
import {
   SafeAreaView,
   ScrollView,
   StatusBar,
   StyleSheet,
   Text,
   useColorScheme,
   View,
 } from 'react-native';
 
import {
   Colors,
   DebugInstructions,
   Header,
   LearnMoreLinks,
   ReloadInstructions,
 } from 'react-native/Libraries/NewAppScreen';

import  { Button } from 'react-native-elements';
import Icon from 'react-native-vector-icons';

const HomeView = () => {
    return (
        <View>
        <Button
        title="Solid Button"
        />

        <Button
        title="Outline button"
        type="outline"
        />

        <Button
        title="Clear button"
        type="clear"
        />

        <Button
        icon={
            <Icon
            name="arrow-right"
            size={15}
            color="white"
            />
        }
        title="Button with icon component"
        />

        <Button
        icon={{
            name: "arrow-right",
            size: 15,
            color: "white"
        }}
        title="Button with icon object"
        />

        <Button
        icon={
            <Icon
            name="arrow-right"
            size={15}
            color="white"
            />
        }
        iconRight
        title="Button with right icon"
        />

        <Button
        title="Loading button"
        loading
        />
        </View>
    );
}
 
 const styles = StyleSheet.create({

});
 
 export default HomeView
Sign up to request clarification or add additional context in comments.

3 Comments

I still got the same error as in the screenshot, but now "Check the render method of HomeView"...hmm
Instead of div use view
Still the same error hmm. Already tried using App.js only without the Homepage.js, also the same error...

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.