fastclick在挪动端运用input=“file”上传文件时label中的内容不能触发change事宜的bug

2024年3月21日 208次阅读 来源: Kingsley

当我的代码以下的时刻

<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的文档

    原文作者：Kingsley
    原文地址: https://segmentfault.com/a/1190000018813639
    本文转自网络文章，转载此文章仅为分享知识，如有侵权，请联系博主进行删除。
点赞