这个VUE前端小功能怎么些

代码功能和这个一样https://blog.csdn.net/weixin_...

我现在需要额外的一个按钮,不是同级按钮,点一下这个按钮就清除所有按钮的选中状态,试了多种方式,都不行,求指导

阅读 2.4k
2 个回答

如果用vue的话,其实很简单,看博客里data写的

 selectTypeIndex: -1, //控制按钮点亮状态,-1为默认不点亮

在新添加的额外按钮上绑定个点击事件,点击时让selectTypeIndex的值等于-1

补:
还原了一下 是可以实现的

<template>
  <div class="home">
    <div><button @click="this.currIndex = -1">清除</button></div>
    <div class="wraC">
      <div class="wra" v-for="(i, ind) in content" :key="i.name" @click="this.currIndex = ind" :class="{isShow:currIndex === ind}">
        <div>{{i.name}}</div>
      </div>
    </div>
  </div>
</template>

data() {
    return{
     currIndex: 1,
      content: [
        {name: "内容1"},
        {name: "内容2"},
        {name: "内容3"},
        {name: "内容4"},
        {name: "内容5"},
      ]
    }
}

点击清空 按钮的时候 把选中按钮的 id 置成 这四个 以外的不就行了?

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题