在往常的开发中总可以用到很多重复的按钮,如果每一次都是重新写一个按钮的话会特别麻烦,以前遇到了很多次都没有记录一下,刚好今天又遇到了特别拿出来记录一下虽然很简单的小东西但是挺实用的。
<div class="button" v-if="isButton">
<div v-for="(item, i) in buttonList" @click="changeData(item)">
{{ item }}
</div>
</div>
这里呢就是我的按钮,这里我用了一个循环是因为项目中的有些地方需要按钮数是不一样的. 接下来在这里使用$emit让父组件对这里的点击进行监听
changeData(val) {
this.$emit('buttonclick', val);
}
父组件中
<div class="content">
<contentBox :width="'512'" :height="'231'" :title="'月度增长趋势'" @buttonclick="buttonclick1">
</contentBox>
</div>
这样监听就可以啦