Vueカスタム命令で自動クリックイベントを実現

Vue は自動クリックイベントを実現しており、ページに入った直後にクリックイベントが発生します。

ここで使用した vue は vue ドキュメントに移動できます。カスタム命令ディレクティブ、特定の用途

1. v-for ループがない場合は、ディレクティブカスタム命令を直接配置します。

<template>
 
<div class="clickdown" @click="myClick()" v-clickDown>自动点击</div>
 
</template>
 
export default {
 
 directives: {
            clickDown: {
                inserted(el) {
                        el.click()
                }
            }
        }
 
}

2. v-for ループがある場合は、最初のインデックスを自動的にクリックする必要があり、その後バインディングが必要になります。

<template>
 
<div class="clickdown" @click="myClick()" v-for="(item,index) in list" :key="index" v-clickDown="index">自动点击索引第一个</div>
 
</template>
 
export default {
 
 directives: {
            clickDown: {
                inserted(el,binding,index) {
                    if(binding.value===0){
                        el.click()
                    }
                }
            }
        }
 
}