question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Remove Spread Operator For Styles to Support Web Better

See original GitHub issue

Thanks to @santiagofm for finding this.

Looks like the spread operator is not really supported by react-native stylesheets. https://github.com/necolas/react-native-web/issues/1259#issuecomment-467668100

The linked issue above is in reference to Stylesheet.create, but it looks like it applies to how styles are done in this repo as well. https://github.com/Cnilton/react-native-floating-label-input/blob/2b96c32c9842380a3db88e1766c74b02f7bc5330/src/index.tsx#L535 (edited to use pinned commit line)

You can easily see the difference in unstyled component in android version image

And web version. image

Solution would be to use array notation for the base styles in this package in order to combine styles. Might look into it when I have the time.

Issue Analytics

  • State:closed
  • Created 2 years ago
  • Comments:6 (6 by maintainers)

github_iconTop GitHub Comments

1reaction
Gamma169commented, Apr 18, 2022

Thanks for reopening. Will try to get to it before month end.

0reactions
Gamma169commented, May 30, 2022

@Cnilton bump on this. Hope you can take a look some time soon.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Style object created with object spread do not get applied on ...
The problem Applying styles using object spread works on Android and iOS but the styles do not get applied when rendering on the...
Read more >
Struggling to use the spread operator on style objects. I'm ...
the spread operator will move the key-value pairs one by one to the new object, but since you are overwriting only one value,...
Read more >
Spread syntax (...) - JavaScript - MDN Web Docs - Mozilla
The spread (...) syntax allows an iterable, such as an array or string, to be expanded in places where zero or more arguments...
Read more >
Use Spread Syntax to Overwrite or Add Styles in React
Even if we create a new style variable we can use the spread operator to make our code more DRY, but this time...
Read more >
Removing Object Properties with Destructuring
This new way to remove object properties (by excluding them from a new object) gives us a cleaner way to write JavaScript, with...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found