Subscribe on changes!

Allow reactive provide for the options API

avatar
Oct 7th 2020

What problem does this feature solve?

Feature parity between the options and the composition APIs. Like many I am using what is arguably the most concise and ergonomic API for Vue3 which turns out to be Vue class component. e.g https://github.com/vuejs/vue-class-component/issues/465 Vue class component I believe "transpile" to the Options API and anyway the Options API needs reactive provide inject too as most existing projects will keep using it just like react hooks does not deprecate in any ways their class API.

https://v3.vuejs.org/guide/component-provide-inject.html#working-with-reactivity From my limited understanding, reactive dependency injection require the use of the Reactivity API which come from the composition API (but shouldn't ? ) such as Vue.computed(), ref(), etc. It is unclear to me whether this reactivity API require to be used on setup() (composition) or if it can be used inside a class component or a standard option component without transforming the component into a full boilerplatey composition api.

What does the proposed API look like?

Allowing the existing required reactivity apis (Vue.computed(), etc) inside the options API thus allowing it too in Vue class components.

avatar
Oct 7th 2020

What is stopping you from doing what's said in the example you provided?

avatar
Oct 9th 2020

What is stopping you from doing what's said in the example you provided?

@posva this link is incorrect

avatar
Oct 9th 2020

@posva What is stopping you from doing what's said in the example you provided? Well the documentation said we would need to assign a Composition API computed property to our provided todoLength so I thougth the composition was not acessible in the options api (without setup) but actually I tried it and it's working fine. The Vue class component Options api wrapper does not (yet ?) allow to access this and therefore cannot provide as of today which is a shame but this is not a vue-next issue I think.