How to update Image url but not refresh the whole scene

[crapthings]

it looks the parent canvas refreshed

function PictureFrame ({ setIsFormOpen }) {
  const ref = useRef(null)
  const voiceRef = useRef(null)

  const [scale, setScale] = useState(0)
  const [imgUrl, setImgUrl] = useState('https://zztek.oss-cn-hangzhou.aliyuncs.com/XDZWDkGhpajhkEaMqOqMf.png')

  const onClickImage = () => {
    if (voiceRef.current === null) {
      voiceRef.current = document.createElement('video')
      voiceRef.current.src = './wtf.mp4'
    }

    voiceRef.current.pause()
    voiceRef.current.currentTime = 0
    voiceRef.current.play()

    setIsFormOpen(true)
  }

  const onPointerOver = () => {
    document.body.style.cursor = 'pointer'
    setScale(.5)
  }

  const onPointerOut = () => {
    document.body.style.cursor = null
    setScale(0)
  }

  useEffect(() => {
    client.on('message', function (topic, payload) {
      console.log(payload)
      setImgUrl(payload.toString())
      appStore.setState({ loading: false })
    })
  }, [])

  return (
    <group onPointerOver={onPointerOver} onPointerOut={onPointerOut} onClick={onClickImage}>
      <Image
        ref={ref}
        url={imgUrl}
        position={[-.5, 3, -13.35]}
        scale={5 + scale}
      />
    </group>
  )
}