Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Error when trying to use Button in react-native

When making a simple react-native program I cannot get the <Button> component to work. The error I always get after react-native run-android is

java.lang.String cannot be cast to com.facebook.react.uimanager.AccessibilityDelegateUtil$AccessibilityRole

When I omit the button, everything works fine, and I can click the Text just fine.

code :

import React, {Component} from 'react';
import {Platform, StyleSheet, Text, View, Button } from 'react-native';



type Props = {};
export default class App extends Component<Props> {
  render() {
    return (
        <View style={styles.container}>

        <Button onPress={()=>console.log('hi')} title="go"/>
        <Text onPress={()=>console.log('hi')}>Welcome to React Native!</Text>

      </View>
        );
      }
 }

some dependencies :

  "dependencies": {
 maar eens alles goed staat hoop ik gewoon dat de miserie gedaan is, cf   "react": "16.6.0-alpha.8af6728",
    "react-native": "0.57.3"
  },
like image 847
Peter Avatar asked Oct 12 '18 15:10

Peter


People also ask

How do you apply a button on react native?

Add styles to buttons in React Native by adding more props For example, you can add a prop to change the button size or change the background color. const AppButton = ({ onPress, title, size, backgroundColor }) => ( <TouchableOpacity onPress={onPress} style={[ styles.

How do I enable a button in react based on condition?

In order to display the button conditionally using the if and else statement, we can use state in react. js. Declare the state in the constructor method because it loads first when the component is loaded. In order to toggle between user and admin, we need to use an event handler.


2 Answers

I've just tested your code on version 0.55. It was perfectly correct and worked fine. I'm likely to have error with your react-native version.

init lower version

react-native init --version="[email protected]" YOUR_APP_NAME

before that try this also

<Button
    onPress={() => alert('hi')}
    title="Press Me"
 >
   Press Me
</Button>
like image 133
Mahdi Bashirpour Avatar answered Nov 12 '22 23:11

Mahdi Bashirpour


A new version of react-native 0.57.4 is now out. Please update your react native version. I tested with the new version and just working fine now.

Hope it works for you too! :)

like image 22
Sagar Unagar Avatar answered Nov 13 '22 01:11

Sagar Unagar