Plans for the Next Iteration of Vue.js

7 Likes

Exposed API for creating observables. This offers a light-weight, dead simple cross-component state management solution for small to medium scale scenarios.

@davestewart Looks like you might be getting your wish granted!

2 Likes

Fragments & Portals: despite the size reduction, 3.0 comes with built-in support for Fragments (component returning multiple root nodes) and Portals (rendering a sub-tree in another part of the DOM, instead of inside the component).

@LinusBorg, is this your Portal Vue component :slight_smile: ?

This is great news!

@andris.vilde Not really, no. It does the same thing, basically, but is directly integrated in the virtualDOM patching process.

I think the functionality will be pretty basic though, so there may still be room to refactor my portal-vue component to wrap this in order to provide additional functionality - but it’s too soon to say, really.

Functional components can finally be plain functions

How it will looks for developers?

yeah! You right!

I would love a way for template inheritance to make it into this version of Vue.

Being able to extend JavaScript is critical, but you can’t do this with templates.

Often I want to be able to to extend from a base class, but reuse its template, or at least populate a slot from it.

It’s something I always come up against.

2 Likes

I’m sorry to say, that’s not something we talk about, really. Probably because it’s not something that comes up as a hot issue out of the community.

The last couple of times I’ve posted about this there’s been interesting discussion, but nothing to come of it :frowning:

@davestewart What do you mean by template inheritance? Couldn’t you just have them all use the same component as their single element in their template?

I need to do a demo for this, it’s always tricky to explain!

So Anthony Gore makes the same point about template inheritance:

https://www.quora.com/Would-you-choose-Vue-js-to-build-a-large-scale-application/answer/Anthony-Gore-5

1 Like

@davestewart I just don’t understand how anyone intends for template inheritance to work - how is this “inheritance” different than using components and slots?

@davestewart I think, we should use composition over inheritance.
For example, create BaseInput:

<template>
  <input :type="type"/>
</template>

<script>
export default {
  name: 'BaseInput',
  props: {
    type: {
      default: 'text'
    }
  }
}
</script>

and use it in EmailInput:

<template>
  <BaseInput type="email"/>
</template>

<script>
export default {
  name:'EmailInput',
}
</script>

We currently use this approach as we don’t have an alternative, but it leads to quite a lot of wiring and “pass-through” props, as well as needing to extend from a separate stub class for the parent component.

Often this kind of extension just needs a single level of inheritance; this is better demonstrated in code, I’ll see what I can do to further the conversation.

1 Like