Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: add ssrRef capability for automatic SSR support #23

Merged
merged 12 commits into from
May 4, 2020
Merged

Conversation

danielroe
Copy link
Member

When creating composition utility functions, often there will be server-side state that can't currently be conveyed to the client.

This PR adds a drop-in equivalent to ref that will automatically add ref values to window.__NUXT__ - if they have been changed from their initial value. It can be used outside of components, such as in shared utility functions, and it supports passing a factory function that will generate the initial value of the ref.

import { ssrRef } from 'nuxt-composition-api'

const val = ssrRef('')

// When hard-reloaded, `val` will be initialised to 'server-set'
if (process.server) val.value = 'server set'

// When hard-reloaded, the result of myExpensiveSetterFunction() will
// be encoded in nuxtState and used as the initial value of this ref.
// If client-loaded, the setter function will run to come up with initial value.
const val2 = ssrRef(myExpensiveSetterFunction)

closes #20

@danielroe danielroe added the enhancement New feature or request label May 4, 2020
@danielroe danielroe self-assigned this May 4, 2020
@danielroe danielroe merged commit f27fae8 into master May 4, 2020
@danielroe danielroe deleted the ssr-ref branch May 4, 2020 19:02
@danielroe danielroe linked an issue May 4, 2020 that may be closed by this pull request
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

Successfully merging this pull request may close these issues.

feat: ssrRef help: Some problem with useFetch
1 participant