Javascript 在组件上有条件地设置属性

对于我的

Overlay

我试图仅在屏幕宽度为320像素宽时设置

高度：“auto”

有人能帮忙吗

    const windowWidth = Dimensions.get("window").width;
    const styles = StyleSheet.create({
      container: [
        {
          padding: 0,
        },
        windowWidth === 320 && { height: "auto" },
      ],...

  return (
    <Overlay
      isVisible={modalVisible}
      overlayStyle={styles.container}
      overlayBackgroundColor="#fff"
    >

const windowWidth=Dimensions.get（“窗口”）.width；
const styles=StyleSheet.create({
容器：[
{
填充：0，
},
windowWidth===320&&{height:“auto”}，
],...
返回(

这可能行得通。您只需扩展样式，并将所需的任何属性直接添加到组件道具中即可

不过，这不会是回应性的。在这种情况下，请转向媒体查询

    const windowWidth = Dimensions.get("window").width;
    const styles = StyleSheet.create({
      container: [
        {
          padding: 0,
        },
     ],...

  return (
    <Overlay
      isVisible={modalVisible}
      overlayStyle={{...styles.container,height: windowWidth === 320 &&  "auto" }}
      overlayBackgroundColor="#fff"
    >

const windowWidth=Dimensions.get（“窗口”）.width；
const styles=StyleSheet.create({
容器：[
{
填充：0，
},
],...
返回(

试试这种方法

 const newStyle = windowWidth === 320 ? { height: "auto"} : {};
  const containerStyle = [
        {
          padding: 0,
        },
        newStyle
      ] 

  return (
    <Overlay
      isVisible={modalVisible}
      overlayStyle={containerStyle}
      overlayBackgroundColor="#fff"
    >

const newStyle=windowWidth==320？{height:“auto”}:{}；
常量集装箱样式=[
{
填充：0，
},
新闻风格
] 
返回(

似乎您最好为带有媒体查询的组件导入样式表。您是否尝试过使用媒体查询？