首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >方法不调用单击。

方法不调用单击。
EN

Stack Overflow用户
提问于 2021-01-23 10:56:01
回答 2查看 54关注 0票数 1

我试着用Vue JS做一个滑块

我设法增加了背景和底部子弹的工作。但是幻灯片锚(prev和next)函数没有触发@click。

仅锚定的HTML。链接到完整html

代码语言:javascript
运行
复制
        <div class="left-anchor w-8 h-8 text-white" @click="sliderCount(-1)">
          <svg  xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M11 19l-7-7 7-7m8 14l-7-7 7-7" />
          </svg>
        </div>
        <div class="right-anchor w-8 h-8 text-white" @click="sliderCount(1)" >
          <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 5l7 7-7 7M5 5l7 7-7 7" />
          </svg>
        </div>

脚本

代码语言:javascript
运行
复制
export default {
data:function(){
    return{
        interval:"",
        currentSlide:0,
        images:['alexandr.jpg','pixabay.jpg','tim-mossholder.jpg'],
        image:''
    }
},
methods:{
  sliderCount:function(count){
      this.currentSlide = (this.currentSlide >= 2) ? 0 : this.currentSlide + count
  },
  setCurrentSlide:function(count) {
      this.currentSlide = count - 1
  }
},
mounted(){
},
beforeMount(){
    this.interval = ''
}
}

为什么这个@click函数不能工作?

EN

回答 2

Stack Overflow用户

回答已采纳

发布于 2021-01-23 11:31:08

我看到了您的代码,发现问题不在Vue JS中。但这只是一个基本的CSS问题的z-索引。只需在样式标记中使用此代码即可。

代码语言:javascript
运行
复制
.anchors{
z-index: 2;
}
票数 3
EN

Stack Overflow用户

发布于 2021-01-23 11:46:07

@FakeAccount是正确的,但是由于您使用的是顺风,所以应该在不定义额外样式规则的情况下添加z-10类:

代码语言:javascript
运行
复制
 <div class="anchors z-10 ...">  
票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/65858362

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档