当我的代码如下的时候
<label for=”file” style=”display: block; width: 100%;”>
<img style=”width:1.20rem;height:1.20rem;border-radius:1.00rem;” :src=”user.avatar ? user.avatar : defultPicUrl” />
<div class=”font32 color33″ style=”margin-top:.30rem;”> 点击编辑头像 </div>
</label>
我发现我点击其他地方可以调用系统的相机以及相册，但是点击头像和文字的时候需要双击才能触发，后来排除原因主要是因为项目中引入了 fastclick 造成的，后来在 issue 中找到了答案：就是加入 css 属性：pointer-events:none; 这个属性要给 label 内部的标签加，可以解决这个问题，代码如下
<label for=”file” style=”display: block; width: 100%;”>
<img style=”width:1.20rem;height:1.20rem;border-radius:1.00rem;pointer-events:none;” :src=”user.avatar ? user.avatar : defultPicUrl” />
<div class=”font32 color33″ style=”margin-top:.30rem;pointer-events:none;”> 点击编辑头像 </div>
</label>
这样就解决了这个问题在此插入关于 pointer-events 的文档