viz doesn't refresh after state change
Tomedry opened this issue · comments
Hi!
When changing state for the 1st time (clicking on the Tom button) the viz re-renders and the filter is applied.
After that the viz doesn't refreshes at all, no matter when button I click, the state changes and F12 shows that the viz does re-render, but no change is applied to the viewed viz.
Would love it if this could be checked,
thanks!
const Stats = () => {
const [name, setName] = useState<String>("Ofir");
const options = {
hideTabs: true,
hideToolbar: true
};
const filters = {
Name: name
};
return (
<div>
<button
onClick={() => {
setName("Tom");
}}
>
Tom
</button>
<button
onClick={() => {
setName("Ofir");
}}
>
Ofir
</button>
<Tableau
url="~~~~~~~"
filters={filters}
options={options}
query="?:embed=yes&:comments=no&:toolbar=yes&:refresh=yes"
/>
</div>
Hi,
the library should be updating changed filters asynchronously.
I think the reason it doesn't work for you is because in javscript, comparison of objects compares reference instead of value. So the value of filters
before and after the update are the same even though filters.Name
is different.
Try this instead:
const Stats = () => {
const [name, setName] = useState<String>("Ofir");
const options = {
hideTabs: true,
hideToolbar: true
};
return (
<div>
<button
onClick={() => {
setName("Tom");
}}
>
Tom
</button>
<button
onClick={() => {
setName("Ofir");
}}
>
Ofir
</button>
<Tableau
url="~~~~~~~"
filters={{ Name: name }}
options={options}
query="?:embed=yes&:comments=no&:toolbar=yes&:refresh=yes"
/>
</div>