vue动态控制元素样式css的隐藏和显示

<template><div @click="clickbj(i)">    //i 为父元素 for 循环的 index点击</div><div @mouseleave="mouseLeave(i)" class="box" :class="{disbox:isBianji==i}"><div class="edit" @click="opendep">编辑</div><div class="edit">删除</div></div>
</templae>
<script>export default {data() {return {isBianji: 0,}},methods: {clickbj(i) {console.log(i)this.isBianji = i},mouseLeave(){this.isBianji = 0},}}
</script>
<style lang="scss" scoped>.box {width: 104px;height: 64px;display: none;}.disbox{display: block;}
</style>