[0.15.x] discussion: v-model vs :prop.sync

[beeplin]

Many components in 0.15 use v-model to control show/hide status. By using v-model the data can be changed either from inside the component itself, or from outside. This is a much better way compared with the old way like $ref.xxx.closeLeft() in 0.14. However, v-model has two drawbacks:

1. one component could has only one v-model, so if the component needs two or more double-directional synced props, it does not work (for example, for now QLayoutDrawer uses v-model since it needs only one prop to control show/hide status – but who knows when in the future it would need more… );

2. v-model has no declarative name for the prop, so it is hard to understand what the v-model is for at the first glance, without referring to the documents.

In fact , :prop.sync can do the same thing. A component can have multiple .sync props, and .sync also give the prop a name to explicitly show what this prop is for. We see QTree and QTable are already using .sync props. Maybe it is worth discussing if we should make more use of .sync rather than v-model, say, just turn this:

<q-layout-drawer v-model="isLeftDrawerShowing">

to this:

<q-layout-drawer :show.sync="isLeftDrawerShowing">