Как вызвать функцию, когда выбрана строка сетки SyncFusion
Используя компонент SyncFusion Vue Grid, мне нужно вызывать функцию, когда выбрана строка. Я попытался добавить столбец с кнопками редактирования, но не могу найти документацию по правильному синтаксису для использования кнопок для вызова функции. Я также попытался найти способ просто вызвать функцию при каждом щелчке по самой строке, что было бы хорошо, если бы я мог определить, какая строка была нажата (доступ к значению одного из полей в строке). API Выбор сетки выглядит это просто для программно выбирающих части сетки, которая не то, что я пытаюсь сделать. Я пробовал следовать этому объяснению но я не мог понять синтаксис кнопки для вызова функции. Я просмотрел документацию Vue и SyncFusion, но не могу найти конкретно, что я пытаюсь сделать. Ниже приведены соответствующие части кода.
<template>
<ejs-grid>
<e-columns>
<e-column
headerText='Buttons'
width='120'
:template='cTemplate'></e-column>
<e-column
field="name"
headerText="Name"
:isPrimaryKey="true"
width="60"
></e-column>
<e-column
field="generalSubject"
headerText="Subject"
width="40"
></e-column>
</e-columns>
</ejs-grid>
</template>
<script>
export default Vue.extend({
data() {
cTemplate: function () {
return { template : Vue.component('columnTemplate',{
template: `<button v-on:click="fx">Edit</button>`, // <-- call fx() syntax??
data: function() {
return {
data: {}
}
},
})}
},
fx: function() { // do something },
},
});
</script>
1 ответ
Ваше требование может быть выполнено с помощью события rowSelected в сетке. Это событие запускается при выборе строки сетки и возвращает сведения о текущей строке в аргументах события.
Пожалуйста, найдите ниже образец, подготовленный на основе этого для вашей справки,
Пример: https://codesandbox.io/s/vue-forked-0knlb?file=/src/App.vue
Ссылка на API: https://ej2.syncfusion.com/vue/documentation/api/grid/#rowselected
Сообщите нам, если вам потребуется дополнительная помощь.
С Уважением,
Суджит Р