React Native 报错 singleValue.stopTracking is not a function -解决

1. 首先贴出报错信息：

2.bug发生的情况：

这是一个点击出现短信验证码弹框的界面，用到了Animated动画和Modal。弹框中当倒计时结束，显示“重发验证码”，这时候点击“重发验证码”，背景整体变黑，不再是0.7的半透明。于是，我在倒计时代码中添加了：BgOpacity:0,如下图：

这时候，我再重新测试，背景好了是0.7的半透明，但是发现点击“重发验证码”按钮，就会报错：singleValue.stopTracking is not a function。

3.解决办法：

在BgOpacity中的0改成初始化的值：即new Animated.Value(0)

/*倒计时处理*/
    countdown() {
        if (typeof this.props.getCodePress == "function") {
            this.props.getCodePress();
        }
        this.setState({
            opa: 0.7,
            BgOpacity:new Animated.Value(0),
        });
        this.setRemainTime(this.state.count)
    }
    
    setRemainTime(count) {
        if (count <= 0) {
            this.setState({
                opa: 1,
                sendText: '重新发送',
                disa: 1,
            })
        } else {
            this.setState({
                sendText: '请等待' + count + '秒',
                opa: 0.7,
                disa: 0,
            });
            count--;
            var _this = this;
            timeID = setTimeout(()=> {
                _this.setRemainTime(count)
            }, 1000);
        }
    }
//显示验证码弹框
showModal() {      
        var _this = this;
        this.setState({
            opa: 0.7,
            count: Config.ChinaMobile.countDownTime
        }, function () {
            _this.setRemainTime(this.state.count);
        });
        var _this = this;
        var bottom = Global.isIOS() ? deviceHeight / 2.5 : deviceHeight / 6;
        this.CMModal.showModal(function () {
            Animated.timing(          // Uses easing functions
                _this.state.BgOpacity,    // The value to drive
                {toValue: 1, duration: 300}            // Configuration
            ).start();
            Animated.timing(          // Uses easing functions
                _this.state.bottom,    // The value to drive
                {toValue: bottom, duration: 300}            // Configuration
            ).start(
            );
        });
    }
//隐藏验证码弹框
hideModal() {
        //清空密码框
        clearTimeout(timeID);
        this.setState({
            password: "",
            count: 0,
            isLeft: '1',
        });
        var _this = this;
        Animated.timing(          // Uses easing functions
            this.state.bottom,    // The value to drive
            {toValue: 0, duration: 10}            // Configuration
        ).start();
        Animated.timing(          // Uses easing functions
            this.state.BgOpacity,    // The value to drive
            {toValue: 0, duration: 10}            // Configuration
        ).start(
            ()=> {
                _this.CMModal.hideModal();
            }
        );
    }

初始化情况：

constructor(props) {
        super(props);
        this.props = props;
        var mobile = Global.getUser() && Global.getUser().userInfo && Global.getUser().userInfo.mobile != undefined ? Global.getUser().userInfo.mobile : "";
        if (mobile != "") {
            mobile = Filter.formatMobile(mobile);
        }
        this.state = {
            bottom: new Animated.Value(0),
            BgOpacity: new Animated.Value(0),
            mobile: mobile,
            password: '',             //6位短信验证码
            count: Config.ChinaMobile.countDownTime,                 //倒计时初始化60秒
            sendText: '获取验证码',     //发送验证码的文案
            opa: 1,                    //文案的半透明度
            disa: 1,                   //验证码按钮是否可点击，1为可点击，0为不可点击
            disv: 0,                   //确定按钮图片是否可点击，1为可点击，0为不可点击
            ensureColor: Color.CM_EnsureBtnColor,   //确定按钮的颜色初始化色值
            noColor: Color.CM_InputTextColor,
            jdAuth: this.props.jdAuth ? true : false,
            isLeft: '',
        }
    }

4.测试完美！~~~