Takuhii
Takuhii

Reputation: 935

Advice needed for ReactJS Equivalent of React-Native-Web stylesheet.flatten

So we are trying to remove React-Native-Web from our codebase, and I was wondering what the ReactJS equivalent of stylesheet.flatten was?

We are using it like this;

const flattenMyStylesheets = StyleSheet.flatten(styles);
const style = Object.keys(flattenMyStylesheets || {}).length ? { style: flattenMyStylesheets } : {};

  return {
    ...
    props: {
      ...style
    }
  };

Failing that what would be the best way to swap this out

Upvotes: 1

Views: 277

Answers (2)

Takuhii
Takuhii

Reputation: 935

So the short answer is that no, there is no equivalent. I investigated and felt that lodash.flatten could work as a substitute, with a little tweaking, but in my case we converted the stylesheets to an object, and just removed the dependency on stylesheet.flatten

Upvotes: 0

Kenny Meyer
Kenny Meyer

Reputation: 8027

You don't usually go the StyleSheet way with native React.

I'd recommend using either a styled-components approach, or with React you can use pure objects for styling instead of relying on the StyleSheet RN API. See here

Note: I'm a React Native + React dev

Upvotes: 1

Related Questions