Skip to content

Conversation

jhuddle
Copy link

@jhuddle jhuddle commented Mar 11, 2022

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
Copy link

pwFoo commented Aug 5, 2022

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

@jikkuatwork
Copy link

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