⼩程序image组件的mode属性以及图⽚出现横向滚动轴官⽅开发⽂档的截图
可以看到，image这个组件有四个属性，这次针对mode属性和我所做的⼩程序中⽤到的图⽚结合讲⼀下。
按照官⽅的mode，分为两类：⼀类缩放，⼀类裁剪。
我所做的pixiv是需要⼤量图⽚的⽹站。P站供画⼿们上传⾃⼰的作品。图⽚有⼤有⼩，按照这个，我们要做的可以分成两种
1、对上传上来的图⽚进⾏缩放（⼀般是缩⼩），放进我们规定好⼤⼩的格⼦中。
2、对上传上来的图⽚进⾏裁剪，假设我们只需要整张图⽚的中间部分就可以了。
因为上述的这两点还要针对⼩程序中的view组件和scroll-view组件区分，这个涉及到了对image的width的设定，现在先讲最普通的view组件。（对于scroll-view中出现的图⽚，也会出现滚动轴的情况，链接在此：）
如图，现在我有⼀张这么⼤的图⽚，我只要放进这么⼩的格⼦⾥⾯。（看红框）
按照分类点，我们来讲第⼀点（缩放）我做的时候出现的问题。html如何设置图片滚动
（看下图）这个⼩格⼦并没有规定⼤⼩，它是⼀个weui-flex__item，也就是flex:1（在这⾥就是占据了整个横⾯的50%）。对于image这个组件本⾝，我设置了width:100%（待会来看看如果把这个100% 去掉会怎样）。对于我们要调整的这张图⽚，⾸先我们明确了是缩放，也就是从scaleToFill、aspectFit、aspectFill、widthFix这四个值中取。下⾯就是四种对应显⽰的样⼦（看图）。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。