Question

当我点击一个按钮来执行此操作时，我想渲染一个组件我添加了一个记住点击的状态。有四个不同的按钮可以渲染四个不同的组件，我是否需要为每个按钮添加状态？还有另外一种方法吗？

Answer 1

您应该有一个父组件。在此父组件中，应该是单击按钮时要显示的所有子组件。然后在父组件中，您有一个州属性（例如activePage），然后将其设置为表示页面名称的字符串（例如activePage =“page1”）。

在父级渲染功能中，您现在可以创建一个switch语句，该语句检查它应该渲染（返回）的组件。

我认为这比在子元素上设置状态更简洁。

Answer 2

是的，你可以做到。对于每个按钮你有4个功能定义

    a:function()
    {

    this.setState({
    flag:a,
value:"hii"

    })
    }



 b:function()
    {

    this.setState({
   flag:b

    })
    }
c:function()
{

this.setState({
flag:c

})
}

d:function()
{

this.setState({
flag:d

})
}

现在您可以将此状态作为道具发送到您的4个组件

<button onClick="this.a"/>
<button onClick="this.b"/>
<button onClick="this.c"/>
<button onClick="this.d"/>

在渲染中你可以调用像这样的组件渲染{

if(this.state.flag==='a')
return <ComponentA finalstate={this.state.value}/>
....follow if else control structure
}

我们是否必须在响应中使用多个状态来单击时访问多个组件

2 个答案: