javascript - 带样式的组件，在谷歌浏览器上中断

Question

更改 Prop 时，样式化的组件在谷歌浏览器上中断(例如，从 true 到 false)。当 props 改变样式时，组件输出类内部没有 CSS，而在 Firefox 上，一切都按预期工作。

下面是代码的一部分

const PeriodsHolder = styled.div`
    justify-content: ${props => (props.childCount ? "baseline" : "center")}
    flex-wrap: nowrap !important;
    overflow-x: scroll;
    margin: 0 -5px;
    min-height: 90vh;
    display: flex;
    flex-wrap: wrap;
    margin-right: -15px;
    margin-left: -15px;
    @media(min-width: 980px){
      flex: 0 0 75%;
      max-width: 75%;
  }
`

Answer 1

您在第一行末尾缺少一个分号。

justify-content: ${props => (props.childCount ? "baseline" : "center")}
                                                                     ^^^^^

其余样式将被忽略。