@@ -2,7 +2,6 @@ import { rendr, useCallback, useState } from '@rendrjs/core';
2
2
import Jumbotron from './Jumbotron' ;
3
3
import Row from './Row' ;
4
4
5
-
6
5
const random = ( max ) => Math . round ( Math . random ( ) * 1000 ) % max ;
7
6
8
7
const A = [ 'pretty' , 'large' , 'big' , 'small' , 'tall' , 'short' , 'long' , 'handsome' ,
@@ -49,39 +48,28 @@ const App = () => {
49
48
return { data : newData , selected : old . selected } ;
50
49
} ) , [ ] ) ;
51
50
const onSwap = useCallback ( ( ) => setState ( old => {
52
- if ( old . data . length > 988 ) {
53
- return {
54
- data : [ old . data [ 0 ] , old . data [ 998 ] , ...old . data . slice ( 2 , 998 ) , old . data [ 1 ] , old . data [ 999 ] ] ,
55
- selected : old . selected ,
56
- } ;
51
+ if ( old . data . length > 998 ) {
52
+ const d1 = old . data [ 1 ] ;
53
+ const d998 = old . data [ 998 ] ;
54
+ old . data [ 1 ] = d998 ;
55
+ old . data [ 998 ] = d1 ;
56
+ return { ...old } ;
57
57
}
58
58
return { data : old . data , selected : 0 } ;
59
59
} ) , [ ] ) ;
60
60
const onAppend = useCallback ( ( ) => setState ( old => {
61
61
return { data : old . data . concat ( buildData ( 1000 ) ) , selected : old . selected } ;
62
62
} ) , [ ] ) ;
63
- const onDelete = useCallback ( ( id ) => {
64
- setState ( old => {
65
- const idx = old . data . findIndex ( ( d ) => d . id === id ) ;
66
- return { data : [ ...old . data . slice ( 0 , idx ) , ...old . data . slice ( idx + 1 ) ] , selected : old . selected } ;
67
- } ) ;
68
- } , [ ] ) ;
69
- const onSelect = useCallback ( ( id ) => {
70
- setState ( old => ( { ...old , selected : id } ) ) ;
71
- } , [ ] ) ;
63
+ const onDelete = useCallback ( ( id ) => setState ( old => {
64
+ old . data . splice ( old . data . findIndex ( ( d ) => d . id === id ) , 1 ) ;
65
+ return { ...old } ;
66
+ } ) , [ ] ) ;
67
+ const onSelect = useCallback ( ( id ) => setState ( old => ( { ...old , selected : id } ) ) , [ ] ) ;
72
68
73
69
return rendr ( 'div' , {
74
70
className : 'container' ,
75
71
slot : [
76
- rendr ( Jumbotron , {
77
- onRun,
78
- onRunlots,
79
- onClear,
80
- onUpdate,
81
- onSwap,
82
- onAppend,
83
- memo : [ ] ,
84
- } ) ,
72
+ rendr ( Jumbotron , { onRun, onRunlots, onClear, onUpdate, onSwap, onAppend, memo : [ ] } ) ,
85
73
rendr ( 'table' , {
86
74
className : 'table table-hover table-striped test-data' ,
87
75
slot : rendr ( 'tbody' , {
@@ -91,7 +79,7 @@ const App = () => {
91
79
selected : state . selected === item . id ,
92
80
onSelect,
93
81
onDelete,
94
- memo : [ item . label , item . id === state . selected ] ,
82
+ memo : [ item . id === state . selected , item . label ] ,
95
83
} ) ) ,
96
84
} ) ,
97
85
} ) ,
0 commit comments