這次為大家帶來Mint UI怎樣實現左滑刪除功能，Mint UI實現左滑刪除功能的注意事項有哪些，下面就是實戰案例，一起來看一下。
關於Mint UI，有文件不夠準確詳盡，元件略顯粗糙，功能不夠完善等問題；也有高度元件化，體積小等優點。
安裝Mint UI：
# Vue 1.x npm install mint-ui@1 -S # Vue 2.0 npm install mint-ui -S
引入元件：
// 引入全部组件
import Mint from 'mint-ui';
import 'mint-ui/lib/style.css'
Vue.use(Mint);
// 按需引入部分组件
import { CellSwipe } from 'mint-ui';
Vue.component(CellSwipe.name, CellSwipe);從文件中摘錄API，Slot如下：
#程式碼範例：
<ul class="list">
<li class="item" v-for="section in sectionList">
<mt-cell-swipe
:right="[
{
content: '删除',
style: { background: '#ff7900', color: '#fff'},
handler: () => deleteSection(section.PartId)
}
]">
<p class="section">{{section.PartName}}</p>
<p class="teacher">{{section.TeacherName}}</p>
</mt-cell-swipe>
</li>
</ul>:right可以定義不只一個按鈕，也可以自行修改CellSwipe的預設樣式
效果顯示：
相信看了本文案例你已經掌握了方法，更多精彩請關注php中文網其它相關文章！
推薦閱讀：
vue jquery lodash滑動時頂部懸浮固定功能實作詳解
以上是Mint UI怎麼實作左滑刪除功能的詳細內容。更多資訊請關注PHP中文網其他相關文章！
