mint-ui仿QQ微信做左滑删除功能

在用H5做APP开发的时候，用到了左滑删除的功能，前端UI框架用的是mint-ui，就用到了一个组件Cell Swipe，直接上案例吧

mt-loadmore + mt-cell-swipe

<div class="page-loadmore"><div class="page-loadmore-wrapper" ref="wrapper" :style="{ height: wrapperHeight + 'px' }"><mt-loadmore:top-method="loadTop":bottom-method="loadBottom":bottom-all-loaded="allLoaded"@top-status-change="handleTopChange"@bottom-status-change="handleBottomChange":auto-fill="false"ref="loadmore"><ul class="carInfoList page-loadmore-list"><mt-spinner :type="1" color="#26a2ff" v-if="showSpinner"></mt-spinner><li class="carInfo listTouch" @click="goDetail(car)" v-for="(car,index) in carList"><mt-cell-swipetitle="哈哈哈":right="[ {
    content: '删除',style: {
    display: 'flex',alignItems: 'center',webkitAlignItems: 'center',width:'3.84rem',justifyContent: 'center',webkitJustifyContent: 'center',background: '#E35959',color: '#fff', textAlign: 'center',fontSize: '0.64rem'},handler: () => deleteCarEvent(car.carID)} ]"><div class="carItem"><div class="carname">{
    {
    car.carNo}}</div><div class="bottom"><div class="left"><div>车架号：<span>{
    {
    car.code}}</span></div><div>发动机号：<span>{
    {
    car.engineNumber}}</span></div></div></div></div></mt-cell-swipe></li><no-data v-if="carList.length === 0"></no-data></ul><div slot="bottom" class="mint-loadmore-bottom"><span v-show="bottomStatus !== 'loading'":class="{ 'is-rotate': bottomStatus === 'drop' }">↑</span><span v-show="bottomStatus === 'loading'"><mt-spinner type="snake"></mt-spinner></span></div></mt-loadmore></div>
</div>deleteCarEvent(carID){
    const _this = this;console.log('要删除的carID为：' + carID)MessageBox.confirm('确定删除?').then(action => {
    deleteCar(carID).then(function(resolve){
    console.log(resolve)console.log(typeof resolve)_this.carList.splice( _this.carList.findIndex(item => item.carID === carID), 1)}, reject => {
    Toast('删除失败');})},reject=>{
    });},

遇到的问题

不知道为什么，内容默认在右侧，强制更改样式

.carInfo .mint-cell:last-child {
    width: 100%!important;
}
.carInfo .mint-cell-title{
    display: none!important;
}
.carInfo .mint-cell-value{
    flex: 1!important;-webkit-box-flex: 1!important;-ms-flex: 1!important;
}
//撑满宽度的时候，不能给父元素padding，不然，删除键高度就与内容不一致
.carInfo .mint-cell:first-child .mint-cell-wrapper{
    padding: 1.25rem 0.83rem !important;
}