Измените источник изображения, если масштаб больше x, используя 2 функции в React? - PullRequest
Новая
       19

Измените источник изображения, если масштаб больше x, используя 2 функции в React?

0 голосов
/ 18 февраля 2020

В настоящее время я пытаюсь изменить источник моего изображения в соответствии с его масштабом, но я не могу заставить его работать.

У меня есть функция, которая загружает мои 2 изображения, и функция, которая изменяет масштабировать, но я не могу соотнести их.

Поэтому я хотел бы использовать свой "testScale" в функции change () , чтобы изменить источник моего изображения в loadImage () function.

В данный момент я назначаю источник "img" своему состоянию "image" в функции loadImage () , и я хотел бы назначить " imgFull "источник, когда мой" testScale "достигает определенного значения.

У кого-нибудь есть идеи?

Спасибо за вашу помощь

Это мои 2 функции:

loadImage: 

loadImages = (frames, size) => {
        this.setState({
            ready: false,
            loaded: 0
        })
        for (let i = 0; i < this.numberOfFrames; i += 1) {
            const {images, testScale} = this.state
            const img = new Image()
            const imgFull = new Image()
            img.onload = () => {
                const {loaded} = this.state
                this.setState({loaded: loaded + 1, ready: loaded + 1 >= this.numberOfFrames})
            }
            imgFull.onload = () => {
                const {loaded} = this.state
                this.setState({loaded: loaded + 1, ready: loaded + 1 >= this.numberOfFrames})
            }
            imgFull.src = frames[i].replace('1920', 3840)
            img.src = frames[i].replace('1920', size)
            images[i] = img
            this.setState({images})
            console.log(images)
        }
    }

изменить: 

    change = (event, value) => {
        const {initialScale} = this.state
        let finalValue = value
        if (value == null || value === 'undefined') {
            finalValue = 0.5
            console.log(value)
        } else if (value < initialScale) {
            finalValue = initialScale
        }
        this.setState({
            testScale: finalValue
        })
    }
...