attach

Wrapper for effect which allow to map effect arguments and use data from stores.

Use cases: declarative passing values from stores to effects and argument preprocessing.

import {createEffect, attach, createStore} from 'effector'
const backendRequest = createEffect({
async handler({token, data, resource}) {
const req = fetch(`https://example.com/api${resource}`, {
method: 'POST',
headers: {
Authorization: `Bearer ${token}`,
},
body: JSON.stringify(data),
})
},
})
const requestsSend = createStore(0).on(backendRequest, total => total + 1)
requestsSend.watch(total => {
console.log(`client analytics: sent ${total} requests`)
})
const token = createStore('guest_token')
const authorizedRequest = attach({
effect: backendRequest,
source: token,
mapParams: ({data, resource}, token) => ({data, resource, token}),
})
const createRequest = resource =>
attach({
effect: authorizedRequest,
mapParams: data => ({data, resource}),
})
const getUser = createRequest('/user')
const getPosts = createRequest('/posts')
const user = await getUser({name: 'alice'})
/*
POST https://example.com/api/user
{"name": "alice"}
Authorization: Bearer guest_token
*/
// => client analytics: sent 1 requests
const posts = await getPosts({user: user.id})
/*
POST https://example.com/api/posts
{"user": 18329}
Authorization: Bearer guest_token
*/
// => client analytics: sent 2 requests

attach({effect, mapParams})

Arguments

  • effect (Effect): Wrapped effect
  • mapParams ((newParams) => effectParams): Function which receives new params and map them to params for wrapped effect, should be pure. Works like event.prepend

Returns

Effect: New effect

attach({effect, mapParams, source})

Arguments

  • effect (Effect): Wrapped effect
  • mapParams ((newParams, values) => effectParams): Function which receives new params and current value of source and combine them to params for wrapped effect, should be pure
  • source (Store | {[key: string]: Store}): Store or object with stores which values will be passed to second argument of mapParams

Returns

Effect: New effect