Question

我正在构建我的第一个React-Native应用

我在渲染中有一张桌子，我就是这样插入的：

render() {
        return (

            <View style={styles.container}>

                {
                    (this.state.loading) ? <Text>Loading</Text>:
                    <CombinedChart
                        data={this.state.data}
                        xAxis={this.state.xAxis}
                        yAxis={this.state.yAxis}
                        legend={this.state.legend}
                        onSelect={this.handleSelect.bind(this)}
                        onChange={(event) => console.log(event.nativeEvent)}
                        marker={this.state.marker}
                        animation={{durationY: 1000,durationX: 1000}}
                        maxVisibleValueCount={16}
                        autoScaleMinMaxEnabled={true}
                        zoom={{scaleX: Math.floor(this.state.days/12), scaleY: 1, xValue:  4, yValue: 4, axisDependency: 'LEFT'}}
                        style={styles.container}/>
                }

                <View style={styles.buttonWrap}>

                    <Button block light onPress={this.zoomTwentyPressed()} style={(this.state.view === 'graph')?styles.buttonStyleCurrent:styles.buttonStyle}>
                        <Text>x100</Text>
                    </Button>
                    <Button block light onPress={this.zoomFiftyPressed()} style={(this.state.view === 'graph')?styles.buttonStyleCurrent:styles.buttonStyle}>
                        <Text>x50</Text>
                    </Button>
                    <Button block light onPress={this.zoomHundredPressed()} style={(this.state.view === 'graph')?styles.buttonStyleCurrent:styles.buttonStyle}>
                        <Text>x25</Text>
                    </Button>

                </View>

            </View>


        );

    }

我从java中的exp中知道，我可以给该对象一个id，然后在类中调用它并使用对象（在这种情况下是＆＃39; CombinedChart＆＃39;）选项。

我如何称呼＆＃39; CombinedChart＆＃39;从另一个函数??

我添加了具有我想要参考图表的函数的代码：

  zoomTwentyPressed() {
      console.log ("pressed 25");
    }

    zoomFiftyPressed() {
      console.log ("pressed 50");
    }

    zoomHundredPressed() {
      console.log ("pressed 100");
      // CHANGE ZOOM HERE

    }


    static displayName = 'Combined';

    handleSelect(event) {
        let entry = event.nativeEvent
        if (entry == null) {
            this.setState({...this.state, selectedEntry: null})
        } else {
            this.setState({...this.state, selectedEntry: JSON.stringify(entry)})
        }

        // console.log(event.nativeEvent)
    }

    render() {
        return (

            <View style={styles.container}>

                {
                    (this.state.loading) ? <Text>Loading</Text>:
                    <CombinedChart
                        data={this.state.data}
                        xAxis={this.state.xAxis}
                        yAxis={this.state.yAxis}
                        legend={this.state.legend}
                        onSelect={this.handleSelect.bind(this)}
                        onChange={(event) => console.log(event.nativeEvent)}
                        marker={this.state.marker}
                        animation={{durationY: 1000,durationX: 1000}}
                        maxVisibleValueCount={16}
                        autoScaleMinMaxEnabled={true}
                        zoom={{scaleX: Math.floor(this.state.days/12), scaleY: 1, xValue:  4, yValue: 4, axisDependency: 'LEFT'}}
                        style={styles.container}/>
                }

                <View style={styles.buttonWrap}>

                    <Button block light onPress={this.zoomTwentyPressed()} style={(this.state.view === 'graph')?styles.buttonStyleCurrent:styles.buttonStyle}>
                        <Text>x100</Text>
                    </Button>
                    <Button block light onPress={this.zoomFiftyPressed()} style={(this.state.view === 'graph')?styles.buttonStyleCurrent:styles.buttonStyle}>
                        <Text>x50</Text>
                    </Button>
                    <Button block light onPress={this.zoomHundredPressed()} style={(this.state.view === 'graph')?styles.buttonStyleCurrent:styles.buttonStyle}>
                        <Text>x25</Text>
                    </Button>

                </View>

            </View>


        );

    }
}

日Thnx

Answer 1

在你的组件中，像这样设置ref：

<CombinedChart 
  ref={component => this.combinedChart = component} 
  ... 
/>

然后在其他功能中，您可以使用this.combinedChart访问它。

如何在render in react native之后引用对象并设置选项？

1 个答案: