2024-07-12
한어Русский языкEnglishFrançaisIndonesianSanskrit日本語DeutschPortuguêsΕλληνικάespañolItalianoSuomalainenLatina
Parfois, nous devons implémenter un en-tête personnalisé, comme ajouter un bouton à l'en-tête. Pour le moment, nous devons utiliser un en-tête personnalisé. Cependant, la description officielle de l'utilisation des en-têtes personnalisés est relativement simple. détail aujourd'hui.
Utilisez :render-header sur l'en-tête lorsqu'un en-tête personnalisé est requis pour activer l'en-tête personnalisé :
<el-table-column :render-header="button"></el-table-column>
Button est une méthode personnalisée qui peut renvoyer le bouton.
Remarque : Pour l'élément bouton renvoyé dans la méthode bouton, vous ne pouvez pas utiliser @click ou v-on:click pour y ajouter une méthode click. Elle ne sera pas reconnue et une erreur sera signalée. Pour utiliser la fonction flèche, on-click={()=>this.showinfo()}
Un bouton est configuré ici, et il y a une variable pour enregistrer sur quel bouton est actuellement cliqué :
données(){
retourner{
isShow : true // Variable pour contrôler le bouton, cliquez sur le bouton
}
},
méthodes : {
bouton(){
si(this.isShow==true){
//Si le bouton est cliqué, change la couleur d'arrière-plan du bouton
retour (
<div>
<el-button on-click={()=>this.show()} style="background: #ffc9c9; color:#606266">Chanson en cours</el-button>