【问题标题】:Why should I use React native StyleSheet?为什么要使用 React 原生 StyleSheet?
【发布时间】:2017-07-31 20:07:55
【问题描述】:

我为什么要使用这个:

const styles = StyleSheet.create({
    ...
});

而不是这个:

const styles = {
    ...
};

StyleSheet 提供的属性对我来说似乎不是很有必要。

【问题讨论】:

    标签: react-native stylesheet


    【解决方案1】:

    渲染性能、更好的无效道具值检测和更好的代码质量。

    1. 当将常规样式对象传递到 StyleSheet.create() 时,模块将冻结对象并为每个对象分配一个 ID。

    ID 通常可以通过网桥和内存进行优化

    1. 样式表对象的某些类型或道具值有效性检查可能会比使用普通对象方法更好地警告您或帮助您解决一些无效的样式问题。

    通过将样式从渲染函数中移开,您正在编写代码 更容易理解。命名样式是增加意义的好方法 到渲染函数中的低级组件。

    据我所见,在设置组件样式时(普通对象、StyleSheet 对象),即使您传递对象数组也是如此。

    缺点使用StyleSheet对象时:

    1)你无法进行这样的比较styles.myNiceComponent.backgroundColor === 'blue'

    这里有更多关于这个缺点的细节: Why can't we check a style attribute of a react-native app?

    2) 根据某些标准(如屏幕旋转)重新计算样式需要一些额外的基础架构代码来确定要使用的样式。如果您使用简单的对象,它们每次都可以在运行中重新计算。

    来源:https://reactnative.dev/docs/stylesheet

    【讨论】:

      猜你喜欢
      • 2014-03-07
      • 2016-12-21
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2019-03-11
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多