swiper - How to disable nested horizontal swiper further scroll (touch release on edges)?

Question

When I was trying to build a nested swiper, the outer swiper is like a tab view which organizes my page, and the inner swiper is a plan selection tool for you to view available plans.

However, the swiper has feature that, when inner swiper runs out of elements, it causes the outer swiper to swipe. However I don't want that behaviour.

I looked up the APIs for hours, find one touchReleaseOnEdges property, but it doesn't work, can anyone give me some idea?

See jsfiddle link https://jsfiddle.net/fdyuestc/eoyceaLL/

var swiper = new Swiper('#outer', {
    pagination: '#outer1',
    slidesPerView: 4,
    centeredSlides: true,
    paginationClickable: true,
    spaceBetween: 30
});
 var swiper = new Swiper('#inner', {
    pagination: '#inner1',
    slidesPerView: 1,
    centeredSlides: true,
    paginationClickable: true,
    spaceBetween: 30,
    nested:true,
    touchReleaseOnEdges: false
});

Answer 1

toEdge event may be of usefull.