当前位置: 首页 > 知识库问答 >
问题:

前端 - elmentui的表格多选在移动端要点击两次才能选择上?

支洋
2024-01-03

elmentui的表格多选在移动端要双击才能选择上,不知道有没有大佬遇到过这个问题

共有2个答案

宗政霄
2024-01-03

你可以安装fastclick 来解决部分问题
首先,安装插件:fastclick

cnpm i fastclick -S

之后,在main.js里引入并使用即可

import FastClick from 'fastclick'FastClick.attach(document.body);
公冶元青
2024-01-03

该问题可能与你的实现有关。不过,根据你给出的信息,我将为你提供一个可能的解决方案。

这个问题可能的原因是你使用了el-tabletype="selection"的配置,而在移动端,你可能需要使用type="radio"来代替。type="radio"会在移动端提供更好的用户体验,因为它只需要点击一次即可选中。

你可以尝试将你的代码修改为以下形式:

<el-table  :data="tableData"  style="width: 100%"  @selection-change="handleSelectionChange">  <el-table-column    type="radio"    width="55">  </el-table-column>  <el-table-column    prop="date"    label="日期"    width="180">  </el-table-column>  <el-table-column    prop="name"    label="姓名"    width="180">  </el-table-column>  <el-table-column    prop="address"    label="地址">  </el-table-column></el-table>

然后,在你的methods中添加一个handleSelectionChange方法来处理选择的改变:

methods: {  handleSelectionChange(val) {    this.multipleSelection = val;  }}

这样,在移动端,你只需要点击一次就可以选择或取消选择一个项目了。希望这个解决方案能帮助你。

 类似资料: