0.2.1 • Published 4 years ago
@vue-reactivity/when v0.2.1
Install
If you are making Vue applications, try when
in VueUse instead.
Usage
Wait for some async data to be ready
import { when } from '@vue-reactivity/when'
const { state, ready } = useAsyncState(
fetch('https://jsonplaceholder.typicode.com/todos/1').then(t => t.json()),
{},
)
await when(ready).toBe(true)
console.log(state) // state is now ready!
Wait for custom conditions
You can use
invoke
to call the async function.
import { when, invoke } from '@vue-reactivity/when'
const { count } = useMyCounter()
invoke(async() => {
await when(count).toMatch(v => v > 7)
alert('Counter is now larger than 7!')
})
Timeout
// will be resolve when ref.value === true or 1000ms passed
await when(ref).toBe(true, { timeout: 1000 })
// will throw if timeout
try {
await when(ref).toBe(true, { timeout: 1000, throwOnTimeout: true })
// ref.value === true
} catch(e) {
// timeout
}
More Examples
await when(ref).toBe(true)
await when(ref).toMatch(v => v > 10 && v < 100)
await when(ref).changed()
await when(ref).changedTimes(10)
await when(ref).toBeTruthy()
await when(ref).toBeNull()
await when(ref).toBeNaN()
await when(ref).toContain(5)
await when(ref).not.toBeNull()
await when(ref).not.toBeTruthy()
License
MIT