React Native,如何创建有状态组件的多个实例?

时间:2019-07-08 15:58:24

标签: javascript react-native

假设我有一个组件'Drawing',它具有其自己的状态,如画笔,颜色选择,背景图像等。 我还有一个名为“多张图纸”的组件,现在我想在“多张图纸”中创建“图纸”组件的多个实例。当用户对任何组件进行更改时,所有数据都应限于该特定组件(我不希望所有数据都驻留在“多个图形”父组件内)。如何实现

export default class Drawing extends Component
{
    constructor()
    {
        super();
        this.state=
        {
            BrushWidth:10,
            BrushOpacity:50,
            SelectedColor:'red',
        }
    }
}
export default class MultipleDrawing extends Component
{
    constructor()
    {
        super();
        this.state=
        {
            AllDrawings:[],
            SelectedDrawingIndex:0
        }
    }
}
componentWillMount()
{
    let allDrawings=[]
    allDrawings.push(<Drawing/>)
    allDrawings.push(<Drawing/>)
    this.state.AllDrawings=allDrawings
}
render(){
    return(
        <View>
            {this.state.AllDrawings[this.state.SelectedDrawingIndex]}
        </View>
    )
}

0 个答案:

没有答案