React-data-grid: Using extra data in a react-data-grid formatter

[jamesajones]

• Have you already searched for similar issues? Please help us out and double-check first!
  yes

• Also, please don't be that person who deletes this template. It's here for a reason.

• Thanks!

---

Which version of React JS are you using?

✅ Officially supported ✅

• [ ] v15.4.x

⚠️ Not officially supported, expect warnings ⚠️

• [ ] v15.5.x
• [ x] v15.6.x

☣️ Not officially supported, expect warnings and errors ☣️

• [ ] v16.x.x

---

Which browser are you using?

✅ Officially supported ✅

• [ ] IE 9 / IE 10 / IE 11
• [ ] Edge
• [ ] Chrome

⚠️ Not officially supported, but "should work" ⚠️

• [ x] Firefox
• [ ] Safari

---

I'm submitting a ...

• [ ] 🐛 Bug Report
• [x ] 💡 Feature Request

👋 Need general support? Not sure about how to use React itself, or how to get started with the Grid?
Please do not submit support request here. Instead see

https://github.com/adazzle/react-data-grid/blob/master/CONTRIBUTING.md

---

Issue Details

Please include:
- What the current behavior is
- What the desired behvaior is
- (If Bug) Steps to reproduce the issue
- (If Feature) The motivation / use case for the feature

We especially love screenshots / videos of problems, and remember
The Best Issue Is A Pull Request™

have read several discussions of passing row data into formatters but have not seen how the Formatter handles the row data specifically in the static propTypes{} block. This of course is in the case of a Formatter which is a separate class.

[jamesajones]

In the render method of the formatter pull in the row data const rowData = this.props.dependentValues();
look at what is there and decide how you want to use it.

[thehungrycoder]

I know this is old but i also needed something like this. not sure how your solution worked as dependentValues isn't a method in the scope of the formatter. however, this is how i've got it working:

in the column definition, specify getRowMetaData function something like:

 formatter: MyCustomFormatter,
 getRowMetaData: (rowData, columnInfo) => {
  return {rowData, columnInfo};
}

Now, in your formatter (this.props.dependentValues), you'll get whatever the you've returned here (in case of this example it'll be current row data and column config)