棉布错误在设置样式时重复键

发布于 2025-02-12 21:31:18 字数 442 浏览 4 评论 0 原文

设置我的样式时，如何避免重复键或嵌套三元？我需要更改iOS和某些iPhone的利润。

import DeviceInfo from 'react-native-device-info';

const devices = ['iPhone 12', 'iPhone 12 Pro', 'iPhone 12 Pro Max'];

const styles = StyleSheet.create({
  container: {
    flexDirection: 'row',
    paddingHorizontal: 20,
    paddingTop: 10,
    marginBottom: Platform.OS === "ios" ? 10 : 0;,
    marginBottom: devices.includes(DeviceInfo.getModel()) ? 30 : 0
  },

原文

How can I avoid having duplicate keys or nested ternarys when setting my style? I need to change the margin for ios and certain iPhones.

import DeviceInfo from 'react-native-device-info';

const devices = ['iPhone 12', 'iPhone 12 Pro', 'iPhone 12 Pro Max'];

const styles = StyleSheet.create({
  container: {
    flexDirection: 'row',
    paddingHorizontal: 20,
    paddingTop: 10,
    marginBottom: Platform.OS === "ios" ? 10 : 0;,
    marginBottom: devices.includes(DeviceInfo.getModel()) ? 30 : 0
  },

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

轻许诺言 2025-02-19 21:31:18

怎么样。
marginbottom ：（ platform.os ===“ ios”＆amp;＆amp; 10）|| （设备。包括（deviceInfo.getModel（）＆amp;＆amp; 30）|| 0;

它可能不完全适合您想要的东西，但是有了一点修改，应该有可能。

回复收藏 0 原文

遥远的绿洲 2025-02-19 21:31:18

如果您的衬里不允许使用嵌套操作员，您可以定义一个持有数据的变量：

因为该值将始终为 0 for non-ios， 30 如果在设备和 10 中包含，则您的逻辑可以看起来像：

let iosMarginBottom = 0;
if (Platform.OS === "ios" ) {
    iosMarginBottom = (devices.includes(DeviceInfo.getModel() ? 30 : 10);
}
const style = {
    marginBottom: iosMarginBottom;
}

If your linter does not allow the use of a nested ternary operator, you can define a variable holding the data:

Since the value will always be 0 for non-ios, 30 if included in devices and 10 otherwise, your logic can look something like:

let iosMarginBottom = 0;
if (Platform.OS === "ios" ) {
    iosMarginBottom = (devices.includes(DeviceInfo.getModel() ? 30 : 10);
}
const style = {
    marginBottom: iosMarginBottom;
}

回复收藏 0 原文

~没有更多了~