react-pivot icon indicating copy to clipboard operation
react-pivot copied to clipboard

Display ReactElement in dimensions.

Open Distil62 opened this issue 7 years ago • 2 comments

Hello,

I'm trying to display a React Element in my dimension row but it don't work. Like that

var dimensions = 
[
		{ title: "Type de gravier", value: function (row) { return row.data.materialName } },
		{
			title: "état", value: function (row) {
				var res;
				if (row.data.state == "good") {
					res = React.createElement("div", {className: "1stClass"}, <div></div>)
				}
				else {
					res = React.createElement("div", { className: "2ndClass" }, <div></div>)
				}
				console.log(res);
				return res;
			}
		},
]

how can i do that ? Thank

Distil62 avatar Jun 16 '17 08:06 Distil62

In https://github.com/davidguttman/react-pivot/blob/8ee1abc7660fe662651d81db222662ecb346e83b/lib/pivot-table.jsx#L132 changing the code to

<span>{text || ''}</span> {solo}

allows the user to render any react element. Instead of returning a string, the template key in the dimension's specification can return an actual React element.

@davidguttman Is this a change that you would be interested in doing? This would likely be a backwards-incompatible change.

suriya avatar Dec 26 '18 10:12 suriya

Yep, this would be great, but I'm pretty sure we could handle both, right?

davidguttman avatar Jan 11 '19 19:01 davidguttman