1
0
mirror of https://github.com/jbranchaud/til synced 2026-01-03 15:18:01 +00:00

Add Inline Component Styles With React Reason as a reasonml til

This commit is contained in:
jbranchaud
2018-02-17 09:30:47 -06:00
parent 2b13c7ea9e
commit b15703ec07
2 changed files with 31 additions and 1 deletions

View File

@@ -0,0 +1,29 @@
# Inline Component Styles With Reason React
If you've written much React.js, the following may look familiar:
```javascript
<span style={{
width: "10px",
height: "10px",
backgroundColor: "rgb(200, 64, 128)"
}} />
```
This is how we do inline styles with JSX in JavaScript.
When it comes to doing inline styles with JSX in our ReasonML code, the best
approach for now is to use a `make` function for styles provided by the
React DOM bindings.
```reason
<span style=(
ReactDOMRe.Style.make(
~width="10px",
~height="10px",
~backgroundColor="rgb(200, 64, 128)",
())
)/>
```
[source](https://reasonml.github.io/reason-react/docs/en/style.html)