2

我有一个奇怪的问题。我有一个运行 react/redux 和节点的 aws 无服务器应用程序。我也在使用带有反应的 Ant 设计。

当我部署到 aws 时，正在注入内联 css（我认为）。

在我的本地机器上，以下代码：

<Col xs={36} sm={12}>
  <FormItem label={showLabel('Date and Time ', this.props.deviceSize)}>
    {(<DatePicker
      placeholder="Date and Time"
      size="large"
      showTime={{ format: 'HH:mm:ss' }}
      format="YYYY-MM-DD HH:mm:ss"
      onChange={(_, val) => {
        this.setState({ date: val });
      }}
    />)}
  </FormItem>
</Col>

产生：

<div class="ant-form-item-control-wrapper">
  <div class="ant-form-item-control">
    <span class="ant-form-item-children">
      <span class="ant-calendar-picker ant-calendar-picker-large">
        ...
      </span>
    </span>
  </div>
</div>

但是一旦我部署到 aws，它会产生以下内容：

<div class="ant-form-item-control-wrapper">
  <div class="ant-form-item-control">
    <span class="ant-form-item-children">
      <span class="ant-calendar-picker ant-calendar-picker-large" style="width: 195px;">
        <div>
          ...
        </div>
      </span>
    </span>
  </div>
</div>

style="width: 195px;"已添加。这是抛弃我的设计。

我将如何解决这个问题？

更新 1

我意识到如果showTime和format属性被删除，部署的 aws 渲染在没有注入的情况下表现如预期style="width: 195px;"

更新 2

所以这个style="width: 195px;"注入看起来很奇怪，所以我ant-design/ant-design在 github 上搜索了这个字符串。它出现了三个位置。

1) components/date-picker/ tests / snapshots / demo.test.js.snap

2)站点/主题/模板/Home/BannerImage.jsx

3) components/form/ tests / snapshots / demo.test.js.snap

似乎我必须弄清楚是什么原因导致添加该宽度。或者在渲染后找到一些方法来删除该样式（尽管这感觉是解决这个问题的错误方法）。

4

0 回答 0