Accepted answer

what you could do is store all your styles in an object in some file e.g. const containerstyles = { borderradius: 2 }, export it, then for react native use the stylesheets javascript class to create the styles for your div container

import {containerstyles} from '../somefile.js'

const styles = stylesheets.create({
  container: containerstyles

then for react you could do inline styling with the same object, but be aware that not all styles supported in stylesheets can be used for inline styling, so if you want to do something equivalent there's libraries out there like emotion.js to dynamically load css in js heres an example

import {css} from 'emotion'
import {containerstyle} from '../somefile'

const getcontainerstyles = css`
  border-radius: ${containerstyle.borderradius}

export default class someclass extends component {
  render() {

i hope this helps


you could concatenate the style of your new component with the style of container, like below

const styles = stylesheet.create({
  container: {
    borderradius: 4,
    borderwidth: 0.5,
    bordercolor: '#d6d7da',
     // new component style

<view style={[styles.container, styles.newcomponent]}> 


// your component file name  (button.js) 
import react, { component } from 'react';

// import the style from another file present in the same directory
import styles from ''; 
 // you can reuse this style in another component also

class button extends component {
    render() {
        return (
            <view style={styles.container}>
                <text style={styles.buttontext}> press me! </text>

export default button;

// your style file  name ( "")

import { stylesheet } from 'react-native';

export default stylesheet.create({
    container: {
        padding: 10,
        alignitems: 'center',
        justifycontent: 'center',
        backgroundcolor: '#43a1c9',
    buttontext: {
        fontsize: 20,
        textalign: 'center'

Related Query

More Query from same tag