my app has a ‘row’ built from ioncol, and ionitems, or ionlist/ionitems
I want to add the slide to delete function
it ‘seems’ that the doc implies that the ‘required’ ionitem, MUST be a direct child of the ion-item-sliding
my rows are built with v-for…
when I do that
<template>
<ion-item-sliding
v-for="(row, i) in data[info.Type + 's']"
:key="row + '.Name'"
>
<ion-item-options side="start">
<ion-item-option color="danger" expandable>
Delete
</ion-item-option>
</ion-item-options>
<ion-item>
<ion-row
:ref="info.Type + i"
v-press="info.Type"
@press="deleteRow(i, info.Type)"
v-dbltapd="info.Type"
@dbltap="addeditClicked(2, i, info.Type, 'edit', $event)"
@dbltap2="
addeditClicked(
1,
getselectedRow(info.Type),
info.Type,
getselectedRow(info.Type) == -1 ? 'add' : 'edit',
$event
)
"
>
<ion-col
v-for="field in info.Fields"
:key="field.Name"
:size="field.width"
class=" colb center "
@click="setClickedRow(i, info.Type, field.Name, $event)"
>
<ion-list v-if="field.Name == 'Tags'">
<ion-item
v-for="(id, i) of row[field.Name]"
:key="i"
class=" colb center "
>
{{ tagfromID(id) }}
</ion-item>
</ion-list>
<ion-list v-else-if="field.Name == 'Type'">
<ion-item
v-for="(id, i) of row[field.Name]"
:key="i"
class=" colb center "
>
{{ id }}
</ion-item>
</ion-list>
<ion-list v-else>
<ion-item v-if="field.Name == 'DataSource'" class=" colb center ">
{{ datasourcefromID(row[field.Name]) }}
</ion-item>
<span v-else class=" colb " style="text-align:center;">
{{ row[field.Name] }}
</span>
</ion-list>
</ion-col>
</ion-row>
</ion-item>
</ion-item-sliding>
</template>
I get this
also, my page IS a slide, so how do I hook the ion-item-sliding operation ONLY to the rows, cause left right moves the slide