小编And*_*rea的帖子

VueJS 点击在移动设备上不起作用,未检测到点击侦听器

我试图找出 VueJS 在点击侦听器上的问题出在哪里。所以这里我有一个用户可以选择的可能语言列表:

  • CN
  • FR

该列表被包装成一个<div>通过使用点击侦听器显示或隐藏列表的列表,问题是它仅适用于桌面而不适用于移动设备

这是我拍摄的一些视频,向您展示问题出在哪里

桌面(这里按预期工作)

移动(这里不再工作)

这是我现在用于该组件的代码

<template>
  <div @click="toggleList = !toggleList" class="lang-area" title="Change language">
    <ul class="lang-data">
      <li>{{ currentLanguage | uppercase }}</li>
      <li :key="index"
          @click="selectLang(lang)"
          class="lang-select"
          v-for="(lang, index) in listLanguages"
          v-if="toggleList">
        {{ lang | uppercase }}
      </li>
    </ul>
    <img alt="list languages" class="lang-list"
         src="../../static/icons/language-icon.svg">
  </div>
</template>

<script>
export default {
  props: {
    language: String,
  },
  data() {
    return {
      currentLanguage: this.language,
      toggleList: false,
      languageList: ['en', 'fr', 'it'],
    };
  },
  computed: {
    listLanguages() {
      return this.languageList.filter(lang …
Run Code Online (Sandbox Code Playgroud)

html javascript mobile onclicklistener vue.js

10
推荐指数
1
解决办法
7638
查看次数

标签 统计

html ×1

javascript ×1

mobile ×1

onclicklistener ×1

vue.js ×1