如何通过多个参数在部件功能在阵营

如何通过多个参数中的部件的功能在阵营如何通过多个参数在部件功能在阵营

function Ads(product_title, description) { 
    return(
     <div className = "row" id="user-ads"> 
    <div className = "col-sm-6 col-md-5"> 
     <div className = "thumbnail"> 
     <img src = "img/img1.jpg" alt = "Generic placeholder thumbnail" /> 
     </div> 
     <div className = "caption"> 
     <div className="border"> 
     <h3>{product_title.title}</h3> 
     <p>{description.desc}</p> 
      <button className = "btn btn-primary" role = "button" data-toggle="modal" data-target="#view-detail">View Details 
      </button> 
       </div> 
       </div> 
        </div> 
        </div> 
    );

}

ReactDOM.render(<Ads title="PlayStation 4" desc="Lorem ipsum jipsum Lorem ipsum jipsum"/>, document.getElementById('ads'));

只有上述代码取的值第一个参数

来源

2016-09-20 Osama Xäwãñz

无国籍反应的组分只接收一个参数，它包含了所有的道具的对象：

function Ads(props) { 
    // access props.title 
    //  props.desc 

    // ... 
}

也许变得更加明显，如果你look at what the JSX is actually converted to：

// Before: 
<Ads title="PlayStation 4" desc="Lorem ipsum jipsum Lorem ipsum jipsum"/> 
// After: 
React.createElement(
    Ads, 
    { title: "PlayStation 4", desc: "Lorem ipsum jipsum Lorem ipsum jipsum" } 
);

一个常见的模式就是用destructuring直接进入道具：

function Ads({title, desc}) { 
    // ... 
}

来源

2016-09-20 18:20:33

TypeError：product_title未定义 –

必须在每个地方都使用'props.title' **而不是**'product_title'。我认为这很清楚。 –

感谢您的帮助，现在工作得很好 –

在您提供的示例中，product_title.desc应具有您正在查找的值。当你打电话给<Ads title="PlayStation 4" desc="Lorem ipsum jipsum Lorem ipsum jipsum"/>时，title和desc都会作为一个对象的属性传递给你的组件函数，所以你的函数中都可以使用你指定的第一个参数的名字，在你的情况下这个名字是product_title。

来源

2016-09-20 18:19:49 slugo

如何通过多个参数在部件功能在阵营

回答

相关问题