What problem does this feature solve?

More flexible bind variables

What does the proposed API look like?

<style>
.content{
  height: v-bind(`${height}px`);
}
</style>

see sfc

see sfc

Sorry, I have overlooked a key factor. When using scss at the same time, the template string will fail to compile. I don’t know if it is the cause of vite or vue. Please solve it.

<style scoped lang="scss">
.content{
    height: v-bind(`${height}px`);
}
</style>

error :

Error: expected ")".
    ╷
  3 │     height: v-bind(`${height}px`);
    │                    ^
    ╵

This is not something Vue or Vite can fix, it's only because SCSS doesn't allow the syntax.

This should be valid in SCSS though: v-bind("height + 'px'");