Ability to reference <template> as Hyperscript in render()

[amcsi]

What problem does this feature solve?

Currently you have to choose between using a <template> or using a render() function. As soon as you would need to reach for something advanced that templates don't allow for, you have to toss out all the nice template code you wrote and rewrite it into more difficult-to-write-and-read render function code, even if it's just a little bit of custom render code you'd need.

It would be cool if for these cases you could mix using both and the render() function by allowing you to reference the hyperscript of the template tag.

I think my API suggestion would be a BC break, because currently render functions don't run if there's a template. So maybe as an alternative to my example below, there could be a special attribute you could give to templates so that they wouldn't prevent the render() function from running, and in addition, you could choose which template you want to reference in your render() function.

What does the proposed API look like?

<template>
  <span>Maybe a link</span>
</template>

<script>
export default {
  props: {
    href: String,
  },
  render(h) {
    // HERE is the newly proposed syntax:
    const template = this.template();

    if (!this.href) {
      // Not a link.
      return template;
    }

    // A link.
    return h('a', {attrs: { href: href }}, [template]);
  },
};
</script>