Question

render(){
        let conf={
            chart: {
                type: 'spline',
                animation: Highcharts.svg, // don't animate in old IE
                marginRight: 10,
                events: {
                    load:function(){
                        var series = this.series[0];
                        setInterval(() =>{
                            var x = new Date().getTime() // current time
                            y = this.props.y
                            series.addPoint([x,y], true, true);
                        }, 900);
                    }
                }
            },
            title: {
                text: 'Live random data'
            }}}

我无法访问load函数中的 this.props.y ，甚至没有任何构造函数变量。我尝试使用箭头功能而不是功能，然后图表不显示任何内容。感谢您的帮助

Answer 1

箭头函数中的

此绑定到图表对象，而不是组件。

您可以在渲染中的变量中缓存 this ，然后在超时时使用它。

render(){
    const component = this

    let conf={
        chart: {
            type: 'spline',
            animation: Highcharts.svg, // don't animate in old IE
            marginRight: 10,
            events: {
                load:function(){
                    var series = this.series[0];
                    setInterval(() =>{
                        var x = new Date().getTime() // current time
                        y = component.props.y
                        series.addPoint([x,y], true, true);
                    }, 900);
                }
            }
        },
        title: {
            text: 'Live random data'
        }}}

无法访问this.props加载高图

1 个答案: