how can I import multiple CSS files conditionally based on this.state data in react native

Question

I need to import multiple css files conditionally in react native project like

import React, { Component } from "react";
if(this.state.language = "he"){
  import styles from "./he";
}else{
  import styles from "./en";
}

But it's not working. I need to add 2 different CSS for LTR and RTL based on language.

Welcome to stackoverflow! Can you explain what is wrong? (Share un-/expected behavior or an error.) — yofee
– yofee, Commented Jul 16, 2019 at 11:10

cuongtd · Accepted Answer · 2019-07-16 11:11:15Z

1

You can do like the following code

import heStyles from "./he";
import enStyles from "./en";

const styles = this.state.language = "he" ? heStyles : enStyles;

edited Jul 16, 2019 at 11:11

answered Jul 16, 2019 at 11:06

cuongtd

3,2323 gold badges22 silver badges39 bronze badges

Sign up to request clarification or add additional context in comments.

11 Comments

Mukesh Kumar Sharma Over a year ago

can I get this.state.language before import statement ?

cuongtd Over a year ago

state belongs to your class component, you cant get it before import

cuongtd Over a year ago

if you store language in asyncstorage, you could create separate style file, import those style file then export specic style based on language get from asyncstorage

Mukesh Kumar Sharma Over a year ago

I can put that asyncstorage condition here as well right?

Mukesh Kumar Sharma Over a year ago

is there any example available for export specific style based on language get from asyncstorage

|

Collectives™ on Stack Overflow

how can I import multiple CSS files conditionally based on this.state data in react native

1 Answer 1

11 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

11 Comments

Your Answer

Sign up or log in

Post as a guest

Related