React-Native duplicate component name - react-native

I am using react-native with native-base theme. Now I want to use react-native-share package. But I need to use Button from both package but I got duplicate identifier error.
import Share, { ShareSheet, Button } from 'react-native-share';
import { Button } from 'native-base';
May I know how to declare another button from react-native-share?

Please try use:
Import { Button as Btn } from 'native-base'
This should resolve your problem.

Related

React Native - Won't navigate to a newly created file

I already have a react-native project which I cloned and running successfully.
I added a new file to the project and tried to link that page using a button from another page with, this.props.navigation.navigate('DisplayHomeScreen');
I couldn't link the 'DisplayHomeScreen.js'.
But when I link a page which was already there, the navigate function is working fine.
Here is the simple code of DisplayHomeScreen.js
import React, { Component } from 'react';
import { View, Text } from 'react-native';
class DisplayHomeScreen extends Component {
render() {
return (
<View>
<Text>Display Home</Text>
</View>
);
}
}
export default DisplayHomeScreen;
As your code snippet is insufficient to identify the problem.can you please share your navigation stack.Well at spot I can/ recommend doing.
yarn install (if you are using yarn as a package manager)
react-native link
close metro bundle
restart app

ReactNative TabBarIOS Undefined

Hell, I'm trying to create a tab bar in my react native app, but after importing it, it appears it's always undefined. Has this component been deprecated? I still see it listed in the docs. https://facebook.github.io/react-native/docs/tabbarios.html
import React, { Component } from 'react';
import {
TabBarIOS
} from 'react-native';
export default class App extends Component {
render() {
return (
<TabBarIOS/>
);
}
}
I'm using react-native 0.59.3
Looks like this has been removed as part of a core cleanup effort. There doesn't appear to be any native alternative that also behaves correctly on tvos.
https://github.com/facebook/react-native/commit/02697291ff41ddfac5b85d886e9cafa0261c8b98
I've gone ahead and extracted TabBarIOS out into a native module for anyone looking for this.
https://github.com/modavi/NativeIOS
install instructions:
npm install git+https://github.com/modavi/NativeIOS#master
react-native link native-ios

Buefy, Vuex, Toast: could not find declaration file

I want to use Toast to show a message from my store.
According to the documentation I have to
import { Toast } from 'buefy/dist/components/toast';
but then typescript warns:
Could not find a declaration file for module 'buefy/dist/components/toast/index.js'
When I import Toast as
import { Toast } from 'buefy'
typescript seems to be satisfied, but the Toast doesn't work.
Which version of Buefy you use? Last version change import statment for Toast, Modal...
You have to do that since v0.8.0:
import { ToastProgrammatic as Toast } from 'buefy'
Toast.open('Toasty!')
https://buefy.org/documentation/toast#from-outside-vue-instance

React Native NativeModules.TextViewManager is null

I'm trying to extend the built in react native TextInput component with a method to return the text selection rectangles for a given range. I followed this pattern here but I'm stuck at this step
import React, { Component } from 'react';
import {AppRegistry, StyleSheet, Text, View, NativeModules } from 'react-native';
var TextViewManager = NativeModules.TextViewManager;
TextViewManager is always null. Does anyone know why or how to get access to TextViewManager so I can call the method I've added to it?
I've tried accessing other managers (eg. WebViewManager) in the same way and it's worked a treat. It just seems like TextViewManager is a special case.
Ok I got itworking and it was because I didn't run react-native run-ios after changing my TextViewManager category source in Xcode. I mistakingly thought react-native log-ios built, installed and logged but it only logs.

alert for both android and IOS in react-native

Hai i am trying to show alert message, i tried different ways like alert,AlertIOS,Alert.alert
AlertIOS is working in IPhone but not working in android and alert also same
In Docs i saw that Alert.alert will work for both Android an IOS,But i got an error like undefined is not an object(evaluating 'Alert.alert')
I wrote like this:
Alert.alert('Alert', 'email is not valid, Please enter correct email', [{text: 'Ok'}]);
I got an error like this:
Any one give suggestions that how to show the alert in Android and IOS in react-native
Any help much appreciated
Are you sure you are including it from the correct path?
I get the same error when I imported Alert from react library and NOT react-native.
so the working thingie is:
import React, { Component } from 'react';
import { View, Alert } from 'react-native';
and the non-working one was:
import React, { Component, Alert } from 'react';
import { View } from 'react-native';
I think you forget to import Alert from react-native
import { Alert } from 'react-native';
and then you can show Alert like this
Alert.alert("Alert message");
We just need to import it correctly:
import { Alert } from 'react-native';
Then use it in your project as written in your code and it will work for both platforms :
Alert.alert('Alert', 'email is not valid, Please enter correct email', [{text: 'Ok'}]);
refer: https://facebook.github.io/react-native/docs/alert