Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Explicitly Document how to bind:values, and why it's an Array #12

Open
rchrdnsh opened this issue Nov 13, 2020 · 4 comments · May be fixed by #16
Open

Explicitly Document how to bind:values, and why it's an Array #12

rchrdnsh opened this issue Nov 13, 2020 · 4 comments · May be fixed by #16
Labels
documentation Improvements or additions to documentation enhancement New feature or request good first issue Good for newcomers

Comments

@rchrdnsh
Copy link

currently I am trying to:

bind:values={[$volume]}

...but I get the following error:

Can only bind to an identifier (e.g. `foo`) or a member expression (e.g. `foo.bar` or `foo[baz]`) (59:3)

...and I honestly only need one value for my use cases (volume slider and timeline, which you have expressed reservations about :-)

so, would it be possible to add a value prop that only takes one number? or is there a way for binding to work with the values prop?

REPL for reference:

https://svelte.dev/repl/9e6d515b510143e4b1b8a7a01940f0db?version=3.29.6

the issue is in the Player.svelte file on line 59.

Thanks a bunch!

@simeydotme
Copy link
Owner

As for your specific problem, please see issue #11 where I described the solution, and also here's the code working;
https://svelte.dev/repl/8945e13fb49b45d598760ba08e8a9c8b?version=3.29.6 :) ... using an array was a trade-off which I have not been able to find a problem with myself... in all instances you may simply store the array instead of an integer.


Talking about a single input bind:value={ singleValue } for when the slider only needs one handle.. actually I had this as an option in the beginning as I agree it's a slightly nicer interface, however it started to cause a few problems, specifically to do with data-binding and reactivity. I had no way to detect changes to either a Integer or an Array and the send that data change back to the correct binding. If you know a way to achieve that which is elegant, please go ahead and submit a PR with some examples in the /test/ folder :)

@simeydotme simeydotme added feature request question Further information is requested wontfix This will not be worked on labels Nov 13, 2020
@rchrdnsh
Copy link
Author

yeah, I ended up doing this instead, which also worked for me:

$: volumes = [$volume]
$: volume.set(volumes[0])

...then...

bind:values={volumes}

...maybe just add an example in the docs for binding to a value in svelte so as to clear up the confusion? Otherwsise it's not that hard, just didn't know how :-)

Anyway, thanks again! XD

@simeydotme
Copy link
Owner

I'll take your suggestion for docs improvement. :)

Actually I do note about binding here; https://simeydotme.github.io/svelte-range-slider-pips/#values and demonstrate it here; https://simeydotme.github.io/svelte-range-slider-pips/#min--max ... but I guess I was mistakenly thinking people would read all the docs in order like a book, hah, so I guess being more explicit about binding values and why it's an array input is a nice addition for the docs.

@simeydotme simeydotme reopened this Nov 14, 2020
@simeydotme simeydotme added documentation Improvements or additions to documentation enhancement New feature or request good first issue Good for newcomers and removed feature request question Further information is requested wontfix This will not be worked on labels Nov 14, 2020
@simeydotme simeydotme changed the title add the ability to pass it a single value? Explicitly Document how to bind:values, and why it's an Array Nov 14, 2020
@rchrdnsh
Copy link
Author

yeah, I read that part, then when I got into binding in svelte I got new issues for me that I did not know how to deal with, so yes, it would be great to add a little bit more to that section. It's also quite possible that people who are using this component are doing so with svelte, so a little example like you have demonstrated in the REPL for working with svelte bindings might be nice. It certainly helped me :-)

@zqianem zqianem linked a pull request Dec 24, 2020 that will close this issue
@simeydotme simeydotme linked a pull request Dec 28, 2020 that will close this issue
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
documentation Improvements or additions to documentation enhancement New feature or request good first issue Good for newcomers
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants