什么是 umi-hd?
umi-hd 是一个基于 umi 的高清方案插件,它可以自动根据屏幕尺寸以及屏幕像素比来选择最优或者用户自定义的清晰度,从而达到最佳的高清体验。
使用前提
在开始使用 umi-hd 之前,你需要先安装 umi 和 umi-plugin-hd。
- -- --- - ------------- --- - --- ------------- ----------
如何使用 umi-hd ?
- 在 umi 插件配置文件(.umirc.js 或 config/config.js) 中,添加 umi-plugin-hd。
------ ------- - -------- - ----------------- ---- -- -- --- --
- 在你的页面组件中使用 umi-hd。
------ ----- ---- -------- ------ -- ---- --------- ------ ------- -------- ------------- - ------ - --- ------ ----- ------------------------- ----- ------------------------- ----- ------------------------- -- -------- ------ ------ -- -------------------------- ------- ------ -- -- -
- 经过上面的配置,你已经成功应用了 umi-hd。现在你可以启动你的应用程序并在不同的设备上进行测试。如果一切顺利,你应该会发现 umi-hd 已经按照设备的视口和像素密度来自动选择了最合适的图像。
指令和参数
img
(必填): 一个对象,其中包含了各种分辨率下的图片路径。键名代表图像的分辨率,键值则代表相应分辨率下的图像路径。style
(可选): 组件的样式对象,可以用来设置组件的长宽、边框等等。className
(可选): 组件的 CSS 类名。alt
(可选): 图像的替代文本。
示例代码
------ ----- ---- -------- ------ -- ---- --------- ------ ------- -------- ------------- - ------ - --- ------ ----- ------------------------- ----- ------------------------- ----- ------------------------- -- -------- ------ ------ -- -------------------------- ------- ------ -- -- -
结尾
希望这篇 umi-hd 使用教程对你有所帮助。umi-hd 的作者已经对其进行了详细的文档说明,更多的使用说明请参考 umi-hd。
来源:JavaScript中文网 ,转载请联系管理员! 本文地址:https://www.javascriptcn.com/post/5f3ddb7adbf7be33b256712a