Expose `$el` to `v-scope` #147

jhuddle · 2022-03-11T01:24:08Z

This small change allows one to use element properties as values for props defined in v-scope. For a toy example:

<textarea
  v-scope="{width: $el.offsetWidth, height: $el.offsetHeight}"
  @click="width = $el.offsetWidth; height = $el.offsetHeight;"
>{{ width }} &times; {{ height }}</textarea>

@click

This small change allows one to use element properties as values for props defined in `v-scope`... I'm finding it makes for a nice shorthand when trying to define such props on mount. For a toy example: ``` <textarea v-scope="{width: $el.offsetWidth, height: $el.offsetHeight}" @click="width = $el.offsetWidth; height = $el.offsetHeight;" >{{ width }} × {{ height }}</textarea> ``` vs. currently: ``` <textarea v-scope="{width: null, height: null}" @VUE:mounted="width = $el.offsetWidth; height = $el.offsetHeight;" @click="width = $el.offsetWidth; height = $el.offsetHeight;" >{{ width }} × {{ height }}</textarea> ```

pwFoo · 2022-08-05T07:31:48Z

Is that added? Tested $el in component or componente template and get no value.

halivert approved these changes Apr 3, 2022

View reviewed changes

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Expose `$el` to `v-scope` #147

Expose `$el` to `v-scope` #147

jhuddle commented Mar 11, 2022 •

edited

pwFoo commented Aug 5, 2022

Expose $el to v-scope #147

Are you sure you want to change the base?

Expose $el to v-scope #147

Conversation

jhuddle commented Mar 11, 2022 • edited

pwFoo commented Aug 5, 2022

Expose `$el` to `v-scope` #147

Expose `$el` to `v-scope` #147

jhuddle commented Mar 11, 2022 •

edited