gpt4 book ai didi

javascript - React + Picturefill 推荐使用方式

转载 作者:行者123 更新时间:2023-11-29 10:38:41 24 4
gpt4 key购买 nike

我想使用 Picturefill + React + React Router(同时使用 Webpack)。


上下文:尚无同构架构,因此在初始页面加载(路由更改)后获取数据。

…因此,渲染方法被调用了两次。

  1. 默认状态一次
  2. 更新状态一次(获取数据)

代码

render: function () {
return (
<picture>
<!-- You get the idea -->

<source srcSet={this.props.large} media="(min-width: 1024px)" />
<source srcSet={this.props.medium} media="(min-width: 640px)" />
<img srcSet={this.props.small} />
</picture>
);
}

示例 1:

<head>
<!-- Recommended usage -->
<script src="https://cdn.rawgit.com/scottjehl/picturefill/2.3.1/dist/picturefill.js"></script>
</head>
  • 在 Safari 8.0.8 中工作
  • 适用于 Chrome 45
  • 在 Firefox 40.0.3 中工作(仅在刷新时,不在调整大小时)

例子2:

// Use picturefill JavaScript API
componentDidUpdate() {
picturefill();
}
  • 适用于 Safari 8.0.8(仅调整大小,页面加载)
  • 适用于 Chrome 45
  • 在 Firefox 40.0.3 中工作(仅在刷新时,不在调整大小时)

更多信息/备选方案?

最佳答案

我建议您使用 picturefill 3.0 RC1结合 mutation plugin .这样你就不需要调用 picturefill();,一切都会自动完成。

这适用于任何浏览器。

关于javascript - React + Picturefill 推荐使用方式,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32727921/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com