Closed damooo closed 4 years ago
Hi @damooo, that would be definitely handy, but I'm afraid that setting the series property this way, the progress animation would start anew from zero each time, instead of starting from the current percentage...
What do you think?
We can make component preserve it's previous state though. like following pseudo-code:
let previousState = 0;
let currentState = 0;
export let series = [];
function updateState() {
previousState = currentState;
currentState = series[0];
}
$: series && updateState();
And we can use internal currentState
, previousState
for actual view. whereas can use series
for exporting contract. Thus two concerns can be disentangled.
Yes... Though I'm not sure if I fully understood your original request... Can you be more specific on what you mean?
Are you looking for a way to directly update the series
prop after a component has been instantiated?
Something like:
const pb = new ProgressBar({
target: document.getElementById('test'),
props: {
series: [90]
}
});
...
pb.series = [50];
To be able to do something like this, we would need to instruct the compiler to create a setter for the series
property.
AFAIK, there's no way to create an accessor for a single property, you can only instruct the compiler to generate accessors for all of the component props (through the <svelte:options accessors />
directive or similar cli flag), and as discussed here, normally this isn't desiderable...
Thanks @okrad .
Instead of getting reference to component, and accessing it's props.. We will just use svelte's way of declaring reactive relationship for series
prop. like following
<script>
let series1 = [50];
function onProgress(e) {
series1 = [e.detail.progress]; // We will update data, and svelte will trigger reactivity on ProgressBar, as we declared for it.
}
</script>
<ProgressBar/ series={series1}>
Hi @damooo, I got it right then... :-)
I'm working on it, I'll let you know when I have something ready!
Hi @damooo, I just published the new version (1.5.0). Now the series prop is reactive and should work as you expected. Can you check it out?
It is working just wonderful.
thank you.
Thanks for great work.
If we can make
series
prop reactive, i.e to set percentage, we can just updateseries
value, instead of binding to elem and updating throughupdatePerc
method, then it will be very convenient in svelte environment.Thanks again for awesome component.