'UseField formik empty value

i'm trying to listen paste event in markdown window then show image at link from server. Like github issues. It's work correct, but i stuck with problem field.value inside function is empty and i can't work with this string, useEffect shows it with value. Link on img in end of code [enter image description here][1]

const [field, meta, helpers] = useField(name)

  const pasteValue = (event) => {
    const items = (event.clipboardData || event.originalEvent.clipboardData)
      .items

    for (let index in items) {
      const item = items[index]
      if (item.kind === 'file') {
        const blob = item.getAsFile()
        const reader = new FileReader()

        reader.onload = async function (event) {
          const result = event.target.result
          // todo compress
          if (result) {
            const loadText = '...Uploading image'
            const name = `mem1-${Math.random()}`
            helpers.setValue(`![image](${loadText})`)
            console.log(field.value)

            await fetcher('/images', {
              method: 'POST',
              body: JSON.stringify({
                base64_image: result,
                image_name: name,
              }),
            }).then((res) => res?.image_url)

            console.log(field.value)
 
            // helpers.setValue(`![image](${url})`)
            // helpers.setValue(field.value.replace(loadText, `![image](${url})`))
          }
        }
        reader.readAsDataURL(blob)
      }
    }
  }

  console.log('Effect ', field.value) ```


  [1]: https://i.stack.imgur.com/B92rh.png


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source