Comment implémenter la fonction de balayage vers la gauche pour supprimer dans Mint UI

Cette fois, je vais vous montrer comment implémenter la fonction de balayage vers la gauche pour supprimer dans Mint UI. Quelles sont les précautions pour implémenter la fonction de balayage vers la gauche pour supprimer dans Mint UI. Voici un cas pratique, jetons un coup d'œil ensemble.

Concernant Mint UI, il y a des problèmes tels que la documentation n'est pas assez précise et détaillée, les composants sont légèrement approximatifs et les fonctions ne sont pas assez parfaites. Elle présente également l'avantage d'être hautement composée de composants et de petite taille. taille.

InstallerMint UI :

# Vue 1.x 
npm install mint-ui@1 -S 
# Vue 2.0 
npm install mint-ui -S

Introduire les composants :

// 引入全部组件 
import Mint from 'mint-ui'; 
import 'mint-ui/lib/style.css' 
Vue.use(Mint); 
// 按需引入部分组件 
import { CellSwipe } from 'mint-ui'; 
Vue.component(CellSwipe.name, CellSwipe);

Extraire l'API du document, le Slot est le suivant :

Exemple de code :

<ul class="list"> 
 <li class="item" v-for="section in sectionList"> 
  <mt-cell-swipe 
   :right="[ 
    { 
     content: &#39;删除&#39;, 
     style: { background: &#39;#ff7900&#39;, color: &#39;#fff&#39;}, 
     handler: () => deleteSection(section.PartId) 
    } 
   ]"> 
   <p class="section">{{section.PartName}}</p> 
   <p class="teacher">{{section.TeacherName}}</p> 
  </mt-cell-swipe> 
 </li> 
</ul>

 : right peut définir plusieurs boutons, ou vous pouvez modifier vous-même le style par défaut de CellSwipe

Affichage de l'effet :

Je pense que vous maîtrisez la méthode après avoir lu le cas dans cet article. Pour des informations plus intéressantes, veuillez prêter attention aux autres articles connexes sur le php. Site chinois !

Lecture recommandée :

Explication détaillée de la fonction fixe flottante supérieure lors du glissement avec vue+jquery+lodash

Vue Utilisation du mécanisme nextTick Explication détaillée

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!