It roll when I use `this.setState()` (Class Components)

[WhiteNightAWA]

As the title, the <AnimatedNumbers /> roll again when I use the this.setState() function even though they are not in the same components. (the animateToNumber value dons't change).

For Example,

import AnimatedNumber from "animated-number-react";
import React, {useState} from "react";
import AnimatedNumbers from "react-animated-numbers";
import {Button} from "@mui/material";

export default class ShowArkBoxIDNumber extends React.Component{
    constructor(props) {
        super(props);
        this.state = {
            a: 123456,
            b: 999
        }
    }

    render() {
        return (
            <div>
                <AnimatedNumbers
                    animateToNumber={this.state.a}
                    fontStyle={{ fontSize: 32 }}
                    configs={(number, index) => {
                        return { mass: 1, tension: 230 * (index + 1), friction: 140 };
                    }}
                ></AnimatedNumbers>
                <Button id={"Button 1"} onClick={() => this.setState({a: Math.round(Math.random() * 1000)})}>Button 1</Button>
                <Button id={"Button 2"} onClick={() => this.setState({b: 123})}>Button 2</Button>
            </div>
        );
    }
}

In this components, If I click Button 1: it roll and change number. If I click Button 2: it roll too but donut change number. Is there any solution?

[heyman333]

I re published module to fix this bug could you check it with lateset version 0.12.2 again?

[shennan]

This issue (or a version of it) is still happening in 0.12.2.

If the component that the numbers are in, reloads due to an unrelated state change, the numbers re-roll.

[heyman333]

This issue (or a version of it) is still happening in 0.12.2.

If the component that the numbers are in, reloads due to an unrelated state change, the numbers re-roll.

ahha. colud you show me exmaple code? I think the config inline fuction can cause re render

[WhiteNightAWA]

@heyman333 Sorry for answering you so late, but this issue is still happening in ^0.12.2. I'm using the same code at the top and that number still roll. 😢

[WhiteNightAWA]

@heyman333 but I think I fixed it... see #31