Dojo 是否可以将动画添加到dgrid行?

Dojo 是否可以将动画添加到dgrid行?,dojo,css-animations,dgrid,Dojo,Css Animations,Dgrid,目前,我们有一个dgrid,其中只有一列和一行,如下所示: 最近,我添加了一些代码,这样我们就可以使用鼠标悬停行上方的小X按钮删除行 处理程序调用此函数以删除该行: this.grid.store.remove(rowId) 当我们删除一行时,由于它是即时的,并且每一行都包含相似的文本,所以用户并不总是很清楚刚刚发生了什么 我想知道是否有可能在行删除中添加某种dojo或css动画,比如删除的行淡出或滑出。这将使行删除更加明显 谢谢我已经为选定行创建了一个动画(擦除) require({

目前,我们有一个dgrid,其中只有一列和一行,如下所示:

最近,我添加了一些代码,这样我们就可以使用鼠标悬停行上方的小X按钮删除行

处理程序调用此函数以删除该行: this.grid.store.remove(rowId)

当我们删除一行时,由于它是即时的,并且每一行都包含相似的文本,所以用户并不总是很清楚刚刚发生了什么

我想知道是否有可能在行删除中添加某种dojo或css动画,比如删除的行淡出或滑出。这将使行删除更加明显

谢谢

我已经为选定行创建了一个动画(擦除

require({
    packages: [
        {
            name: 'dgrid',
            location: '//cdn.rawgit.com/SitePen/dgrid/v0.3.16'
        },
        {
            name: 'xstyle',
            location: '//cdn.rawgit.com/kriszyp/xstyle/v0.2.1'
        },
        {
            name: 'put-selector',
            location: '//cdn.rawgit.com/kriszyp/put-selector/v0.3.5'
        }
    ]
}, [
    'dojo/_base/declare',
    'dgrid/OnDemandGrid',
    'dgrid/Selection',
    'dojo/store/Memory',
    "dojo/fx",
    'dojo/domReady!'
], function(declare, Grid, Selection, Memory,fx) {
    var data = [

        { id: 1, name: 'Peter', age:24 },
        { id: 2, name: 'Paul', age: 30 },
         { id: 3, name: 'Mary', age:46 }
    ];
    var store = new Memory({ data: data });
    var options = {
        columns: [
           /*{ field: 'id',  label: 'ID' },*/
            { field: 'name', label: 'Name' },
            { field: 'age', label: 'Age' }

        ],
        store: store
    };
    var CustomGrid = declare([ Grid, Selection ]);
    var grid = new CustomGrid(options, 'gridcontainer');

    grid.on('dgrid-select', function (event) {
    // Report the item from the selected row to the console.
    console.log('Row selected: ', event.rows[0].data);
        //WipeOut animation for selected row.
        fx.wipeOut({ node: event.rows[0].element }).play();

     });

});

可以使用dojo擦除动画功能滑出该行,然后在动画结束时删除该行。dojo wipeout指南正是我想要的。。非常好:)动画完成后,我仍然需要确保从存储中删除行,否则就是这样。要在动画简单后从存储中删除行,我可以使用ONED属性。例如:fx.wipeOut({node:query('#myGrid row-'+rowId)[0],oned:lang.hitch(this,function(){this.grid.store.remove(rowId);})})。play()我忘了提到有一个事件oned,您可以将delete函数附加到该事件中以删除该行。