Swipeout show actions on click not on swipe?

I am trying to use swipeout but I want the actions to show on click not on swipeout…
is it possible to do this?

I created a virtual list with itemtemplate like this using item-link class to make the line a link and using swipe-click on the li element to call the function below on click :

      itemTemplate:
        '<li class="swipeout swipe-click">' +
          '<div class="item-content item-link no-link swipeout-content">' +
          '<div class="item-media"><i class="icon icon-f7"></i></div>' +
            '<div class="item-inner">' +
              '<div class="item-title-row">' +
                '<div class="item-title">Alert {{id}} - {{title}}</div>' +
              '</div>' +
              '<div class="item-subtitle"><a href="#">{{text}}</a></div>' +
              '<div class="item-text">{{subtitle}}</div>' +

            '</div>' +

            '<div class="swipeout-actions-right">'+
            '<a href="#" data-confirm="Are you sure you want to delete this item?" class="swipeout-delete">Delete</a>'+
            '</div>'+


        '</li>',

function:

$(document).on(“click”,".swipe-click", function(){

console.log($(this).hasClass(‘swipeout-opened’));
if(!$(this).hasClass(‘swipeout-opened’)) {
app.swipeoutOpen($(this)); } else { app.swipeoutClose($(this));
}

});

either app.swipeoutClose or app.swipeoutOpen does not work…
which one is the right way to call these in f7 last version?

appreciated any info…

app.swipeout.open(el, side, callback)
app.swipeout.close(el, callback)

thank you I found it too but lot of time searching how to do it! appreciate your time!!
but I wonder if there is a beautiful way without using item-link to make an item a link without having to have an arrow in the end of the line…

with item-link the link is clickable and look nice but create a blank space when the swipeout is open after the remove action…

thank you!

//html
<li class="swipeout my-swipeout">
  <div class="swipeout-content">
    <a href="#" class="item-link item-content">
      <div class="item-inner">
        <div class="item-title-row">
          <div class="item-title">title</div>
          <div class="item-after">after</div>
        </div>
        <div class="item-subtitle">subtitle</div>
        <div class="item-text">text</div>
      </div>
    </a>
  </div>
</li>

//css
.my-swipeout .item-title-row {
  padding-right: unset!important;
  background-image: unset!important;
}

big thanks trying it :slight_smile: