Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

React Native Text.defaultProps does not exist and creating it doesn't work either

I'm new to React Native (0.59.3) and I'm trying to set default font for all Text components in my app. I've read https://stackoverflow.com/a/47925418/811405 and How to disable font scaling in React Native for IOS app?.

In my App.js I've put:

import { Text } from 'react-native';

Text.defaultProps.style = { 
  fontFamily: 'AmericanTypewriter' //just for testing
}

But I get Cannot set property 'style' of undefined.

When I add the line Text.defaultProps = Text.defaultProps || {}; before that, I don't get an error, but nothing happens (all Text components still use the default font). I've tried with different fonts (both built-in iOS fonts and my custom fonts that I've linked and verified), using their PostScript names, though nothing happens.

What am I doing wrong?

like image 983
Can Poyrazoğlu Avatar asked May 08 '26 16:05

Can Poyrazoğlu


2 Answers

Add this before changing fontFamily style

import { Text } from 'react-native';

Text.defaultProps = Text.defaultProps || {};
like image 133
Gev Avatar answered May 11 '26 07:05

Gev


If you want to have your own custom Text in your app, you usually create a custom Text component ... and either use it directly in your screens ... or use it internally in your other custom components ... this way you're going to have consistent look and feel throughout your app

Example

You'd use AppText in your entire app ... and forget about Text

const AppText = ({ text }) => (
  <Text style={{ fontFamily: 'AmericanTypewriter', ...restOfYourStyles }}>
    {text}
  </Text>
);
like image 40
Hend El-Sahli Avatar answered May 11 '26 07:05

Hend El-Sahli



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!