mirror of
https://github.com/zoriya/react-native-web.git
synced 2026-05-30 17:29:14 +00:00
Minor documentation changes
This commit is contained in:
+3
-10
@@ -31,10 +31,9 @@ const styles = StyleSheet.create({
|
|||||||
})
|
})
|
||||||
```
|
```
|
||||||
|
|
||||||
Using `StyleSheet.create` is optional but provides some key advantages: styles
|
Using `StyleSheet.create` is optional but provides the best performance
|
||||||
are immutable in development, certain declarations are automatically converted
|
(`style` is resolved to CSS stylesheets). Avoid creating unregistered style
|
||||||
to CSS rather than applied as inline styles, and styles are only created once
|
objects.
|
||||||
for the application and not on every render.
|
|
||||||
|
|
||||||
The attribute names and values are a subset of CSS. See the `style`
|
The attribute names and values are a subset of CSS. See the `style`
|
||||||
documentation of individual components.
|
documentation of individual components.
|
||||||
@@ -56,12 +55,6 @@ A common pattern is to conditionally add style based on a condition:
|
|||||||
styles.base,
|
styles.base,
|
||||||
this.state.active && styles.active
|
this.state.active && styles.active
|
||||||
]} />
|
]} />
|
||||||
|
|
||||||
// or
|
|
||||||
<View style={{
|
|
||||||
...styles.base,
|
|
||||||
...(this.state.active && styles.active)
|
|
||||||
}} />
|
|
||||||
```
|
```
|
||||||
|
|
||||||
## Composing styles
|
## Composing styles
|
||||||
|
|||||||
@@ -68,12 +68,6 @@ const registerStyle = (id, flatStyle) => {
|
|||||||
const resolveProps = (reactNativeStyle) => {
|
const resolveProps = (reactNativeStyle) => {
|
||||||
const flatStyle = flattenStyle(reactNativeStyle);
|
const flatStyle = flattenStyle(reactNativeStyle);
|
||||||
|
|
||||||
if (process.env.__REACT_NATIVE_DEBUG_ENABLED__) {
|
|
||||||
console.groupCollapsed('[render] deoptimized: resolving uncached styles');
|
|
||||||
console.log('source style\n', reactNativeStyle);
|
|
||||||
console.log('flattened style\n', flatStyle);
|
|
||||||
}
|
|
||||||
|
|
||||||
const domStyle = createReactDOMStyle(flatStyle);
|
const domStyle = createReactDOMStyle(flatStyle);
|
||||||
const style = {};
|
const style = {};
|
||||||
|
|
||||||
@@ -99,7 +93,14 @@ const resolveProps = (reactNativeStyle) => {
|
|||||||
};
|
};
|
||||||
|
|
||||||
if (process.env.__REACT_NATIVE_DEBUG_ENABLED__) {
|
if (process.env.__REACT_NATIVE_DEBUG_ENABLED__) {
|
||||||
console.log('DOM props\n', props);
|
console.groupCollapsed('[StyleSheet] resolving uncached styles');
|
||||||
|
console.log(
|
||||||
|
`Slow operation. Resolving style objects (uncached result). ` +
|
||||||
|
`Occurs on first render and when using styles not registered with "StyleSheet.create"`
|
||||||
|
);
|
||||||
|
console.log('source => \n', reactNativeStyle);
|
||||||
|
console.log('flatten => \n', flatStyle);
|
||||||
|
console.log('resolve => \n', props);
|
||||||
console.groupEnd();
|
console.groupEnd();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user