我需要在一段時(shí)間後更改行的背景顏色。網(wǎng)格中有一列的時(shí)間以秒為單位，我需要在該時(shí)間過去 50% 後更改行顏色。
網(wǎng)格中的資料本身並沒有改變，因此使用 rowClassRules 似乎不起作用，因?yàn)椴粫?huì)發(fā)生任何變更來觸發(fā)根據(jù)規(guī)則評(píng)估資料。相反，我想到使用具有延遲的 setTimeout() 函數(shù)，但無法弄清楚 setTimeout 區(qū)塊內(nèi)部會(huì)執(zhí)行什麼操作來將 css 類別應(yīng)用到 rowNode。我不想更改行本身中的任何資料。最糟糕的情況是，我想我可以添加一個(gè)新的隱藏列並在計(jì)時(shí)器之後更改該列中的值，但我寧願(yuàn)避免這種情況。我正在使用 React。
我嘗試做這樣的事情：
let red_warnings = [] let yellow_warnings = []
const rowClassRules = {
'.red': (params) => { return red_warnings.includes(params.data.Id) },
'.yellow': (params) => { return yellow_warnings.includes(params.data.Id) }
}
<AgGridReact
rowClassRules={rowClassRules}
/>
// when a new row is added
setTimeout(() => {
yellow_warnings.push(Id)
}, 1000 * Timeout * 0.5)
setTimeout(() => {
red_warnings.push(Id)
}, 1000 * Timeout * 0.8)
但是由於行中沒有實(shí)際更改的數(shù)據(jù)，因此一旦我將 ID 新增到警告數(shù)組中，就不會(huì)觸發(fā)重新評(píng)估 rowClassRules。
1
0
0
這是絕對(duì)可能的。
這個(gè)想法是更新網(wǎng)格資料以套用一些預(yù)先定義的樣式。
例如，我們?cè)?3 秒後將每筆記錄的年齡欄位更新為 100。根據(jù)我們的 rowClassRules，任何年齡大於 98 的資料都將成為我們預(yù)定義樣式的候選者。
function onFirstDataRendered(params) {
setTimeout(function () {
params.api.forEachNode((node) => {
var newData = {
...node.data,
person: {
...node.data.person,
age: 100,
},
}
node.data = newData
params.api.redrawRows()
})
}, 3000)
}
看看這個(gè)笨蛋
