tui.grid
tui.grid copied to clipboard
how to read JSON value from dataSource API
Version : ^4.21.21
Development Environment : Windows OS, Chrome browser, React, Typescript
Current Behavior
I tried to use specific value of JSON , which is from dataSource API, in Grid. But, 'Property does not exist' error message is shown up.
The api response data type sample is below:
{
'key1': 'value1',
'key2': 'value2',
'key3': [
{'options-child1': 'value3'},
{'options-child2': 'value4'}
],
'key4': {
'children': 'value5'
}
},
I use as below : CASE 1 ) using in 'name'
{
header: 'gridColumnName',
name: 'key4.children',
align: 'center',
},
=> I can't make show up 'value5' text on Grid. It shows empty value..
CASE 2 ) trying to use 'OnClick'
const handleClick = useCallback(
({ targetType, columnName, instance, rowKey }: GridEvent) => {
const rowKey_key3 = instance.getValue(rowKey, 'key3') // on Console, rowKey_key3 shows '[object Object],[object Object]'.
const array = Array.from(rowKey_key3 as string)
array.forEach(ele => {
console.log(`ele : ${ele.options-child1 as string}`) // this is error point
})
},
[]
)
=> I can't get 'options-child1' value...
I want to know how to handle JSON data with multiple depth, in Tui-Grid.