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

Two-way data binding #32

Open
bsrdjan opened this issue Dec 17, 2020 · 1 comment
Open

Two-way data binding #32

bsrdjan opened this issue Dec 17, 2020 · 1 comment

Comments

@bsrdjan
Copy link

bsrdjan commented Dec 17, 2020

Thank you for all three sample apps (angular, react, vue), really helpful in evaluations and discussions,

Would it be possible to extend all three apps, with the two-way binding, even the simplest way?

Like for example: two text fields and one checkbox, which can be edited in UI, for view to model changes.
And one button, with the click logic to swap the text fields’ bound data values and toggle the checkbox bound data value, for model to view changes?

The reason I am asking is that two-way binding looks like a kind of challenge.

Angular tutorial

You can use two-way data binding with the following components: CheckBox, RadioButton, Input, DatePicker, Switch, TextArea. In order to use it, you have to use a library called Origami ...

React tutorial

Data binding not mentioned at all, only event binding. There are more possibilities in React, one could be shown as example.

Vue tutorial

v-model binding doesn’t work as expected for custom elements. In order to use two way data binding, you should bind and update the value yourself like this

<ui5-input
    :value="inputValue"
    @input="inputValue = $event.target.value">
</ui5-input>
@nemethmik
Copy link

React doesn't support two-way data binding, there is no such a concept there. You can mimic tow-way binging by adding an event handler. I used to use both Angular and React, both are excellent frameworks, but since we have Lit 2.0 we don't need these frameworks any more. Lit is simply awesome.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants