Skip to content

Expose $el to v-scope - #147

Open
jhuddle wants to merge 1 commit into
vuejs:mainfrom
jhuddle:patch-1
Open

Expose $el to v-scope#147
jhuddle wants to merge 1 commit into
vuejs:mainfrom
jhuddle:patch-1

Conversation

@jhuddle

@jhuddle jhuddle commented Mar 11, 2022

Copy link
Copy Markdown

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>

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 }} &times; {{ 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 }} &times; {{ height }}</textarea>
```
@pwFoo

pwFoo commented Aug 5, 2022

Copy link
Copy Markdown

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

@jikkuatwork

Copy link
Copy Markdown

Can't this be done in v-effect

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

Successfully merging this pull request may close these issues.

4 participants