Question

我已经通过了两个参数，但我不确定如何在以下示例中使用它。如果可以，请帮忙。

updater(layer, item){   
    this.setState({layer5: <img id="layer5" className="on-top img-responsive center-block" name="layer5" src="images\5.png" />});
}

所以这是我目前的代码，我想做的事情如下：

updater(layer, item){   
    this.setState({{layer}: <img id={layer} className="on-top img-responsive center-block" name={layer} src={item.src} />});
}

但是这给了我一个语法错误。

更新：在更改之后，我获得了传入的正确值但由于某种原因状态未更新：

    constructor(){
     super();   
         this.renderView = this.updater.bind(this);
         this.state = {
                 layer1: "1.png",
                 layer2: "",
                 layer3: ""
         };
    }


      updater(layer, item){   
            console.log(layer); //shows as "layer1"
            console.log(item);  // shows as "3.png"
            this.setState({layer: item});
     }

Answer 1

您不应将React组件存储在您的状态中。相反，存储执行渲染所需的信息，并实际渲染render()函数中的组件：

updater(layer, item){   
    this.setState({
        layer5: {
            layer: layer,
            item: item
        }
    });
 }

 render() {
     var layer5 = (
         <img
             id={this.state.layer5.layer}
             className="on-top img-responsive center-block"
             name={this.state.layer5.layer}
             src={this.state.layer5.item}
          />
      )

      ...
}

Meteor React如何使用params传递？

1 个答案: