Nativebase: `<Content>` components not renders correctly on react-native 0.63.0

Created on 10 Jul 2020  Â·  32Comments  Â·  Source: GeekyAnts/NativeBase

I have gone through these following points

Issue Description

node, npm, react-native, react and native-base version, expo version if used, xcode version

node 10.18.0
npm 6.14.3
react-native 0.63.0
react 16.13.1
native-base 2.13.12
XCode 11.5

Expected behaviour

<Content> components renders correctly.

Actual behaviour

<Text>Hi!</Text> is not rendered and output error log below:

Warning: Function components cannot be given refs. Attempts to access this ref will fail. Did you mean to use React.forwardRef()?
Check the render method of `Content`.

Warning: Functions are not valid as a React child. This may happen if you return a Component instead of <Component /> from render. Or maybe you meant to call this function rather than return it.

Steps to reproduce

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

const Foo = () => (
  <Container>
    <Content>
      <Text>Hi!</Text>
    </Content>
  </Container>
)

Is the bug present in both iOS and Android or in any one of them?

Both.

Any other additional info which would help us debug the issue quicker.

Important

If you want your issue to be looked at quicker, attach a snack reproducible with your issue. Makes it easier for us!

Most helpful comment

I have forked the repo to fix this issue.

npm i @codler/native-base

You will need to remove old fonts in Copy Bundle Resources in Xcode after install

All 32 comments

This project is no longer maintained. They don't even make a build from master. Few issues are already fixed there.

Probleme related to change in ScrollView https://github.com/APSL/react-native-keyboard-aware-scroll-view/issues/429 once a PR merge in react-native-keyboard-aware-scroll-view this should be fixed.

@cristian-rita do you recommend other ui lib that's properly maintained?

I have the same issue.

I have forked the repo to fix this issue.

npm i @codler/native-base

You will need to remove old fonts in Copy Bundle Resources in Xcode after install

Thanks @codler.
Why removing old fonts is required ? I have issues rending font on iOS is it the case for you too ?

You will probably get duplicate output file error when building ios, https://medium.com/codespace69/xcode-reactnative-ios-xcode-build-error-with-duplicate-output-file-when-install-new-library-36dfbcb5d223, but if not, then you dont need to do that.

Thanks @codler

I guess I didn't do my homework well enough, choosing Native-Base. It does seem a bit abandoned, which makes me sad. I too would like recommendations for UI projects that are maintained.

@codler Thanks for the effort. Everything worked perfectly.

@MartinMouritzen Agree. I spent A LOT of time looking at a lot of different kits and decided on NB. Unfortunately, this has been my experience with the RN ecosystem. A lot of great libraries/kits/etc that have great promise but fall short.

LOL, I don't really realised this repo is kind of abandoned until I had this problem. But really it is quite a nice lib. Somebody should revive this one.

I have forked the repo to fix this issue.

npm i @codler/native-base

You will need to remove old fonts in Copy Bundle Resources in Xcode after install

I saw you forked rnkasv too. can I just install it but not the whole native-base? @codler

This project is no longer maintained. They don't even make a build from master. Few issues are already fixed there.

Is it really true? New pull requests no longer be merged? I've just started new project with RNB, should I find another UI Kit?

@hanykumar https://github.com/APSL/react-native-keyboard-aware-scroll-view/releases/tag/v0.9.2 just released!
Please update dependency and bump for new release ?

Is this issue fixed??
Please fix it asap and close it!

will this issue be fixed ? If not please suggest another UI library for react native

Please fix the issue!

https://github.com/APSL/react-native-keyboard-aware-scroll-view/issues/443#issuecomment-659357780

npm install https://github.com/APSL/react-native-keyboard-aware-scroll-view#v0.9.2

I updated the react-native-keyboard-aware-scroll-view with the command from the comment and <Content> is working again :D Hope this solves you guys too.

I've tried @Aung-Myint-Thein but didn't work.

Then i've tried this on my package.json:

  "resolutions": {
    "native-base/react-native-keyboard-aware-scroll-view": "https://github.com/APSL/react-native-keyboard-aware-scroll-view#v0.9.2"
  }

Then yarn install and it worked!
While i wait for a proper native-base release. Cheers!

I've tried @Aung-Myint-Thein but didn't work.

Then i've tried this on my package.json:

  "resolutions": {
    "native-base/react-native-keyboard-aware-scroll-view": "https://github.com/APSL/react-native-keyboard-aware-scroll-view#v0.9.2"
  }

Then yarn install and it works!�
While i wait for a proper native-base release. Cheers!

Weird. It is not working for me after fresh npm install. I tried the resolutions method and it is still not working for me. Which React Native, Native Base versions are you using? @jacargentina ?

@Aung-Myint-Thein i'm using yarn, not npm (i dont think npm supports the resolutions feature); BTW i'm with rn 0.63 and latest published native-base

Please fix this issue Asap!

@sankhadeeproy007
is the repository really failing anymore? and will this critical issue be fixed?

Guys, is there a PR for this anywhere?
I'll do a release quickly if I there's one.

This has been fixed after the latest update! You guys can update the nativebase package and it will work

Thanks to @codler for their help in fixing this.

It is working now in my dev but my release apk is crashing upon start with

Name FATAL EXCEPTION: mqt_native_modules
Reason java.lang.ClassCastException: com.facebook.react.bridge.ReadableNativeMap cannot be cast to java.lang.String

Is it happening the same for you guys?..

please fix it asap, thank you.
It spends me a lot of time finding my problem is caused by this lovely native-base package. I have to roll back to older native-base version (v2.6.1) so i can continue my work.

微信图片_20200810221549

If this repo is not being maintained anymore, maybe Paper?

@codler Thank you very much, it worked perfectly, greetings from Chile

I dumped content

...

To
<>
....

+1

Was this page helpful?
0 / 5 - 0 ratings

Related issues

Bundas picture Bundas  Â·  3Comments

eggybot picture eggybot  Â·  3Comments

aloifolia picture aloifolia  Â·  3Comments

nschurmann picture nschurmann  Â·  3Comments

elnygren picture elnygren  Â·  3Comments