小编Mar*_*cho的帖子

我在React Contact List组件中有一个方法，该组件将返回另一个组件。我已经开始工作了，但是很好奇是否有更好的方法来构造我使用密钥的方式。

具体来说-我在下面的方法中询问这一行代码（数据被硬编码为示例入门）：

return <ShortContact contact={contact} key={contact.id}/>

这是上下文中的代码：

_getContacts() {
    let contactList = [
        {
            id: 1,
            fName: "aaa",
            lName: "aaaaa",
            imgUrl: "http://brainstorminonline.com/wp-content/uploads/2011/12/blah.jpg",
            email: "aaa@aaaa.com",
            phone: "999999999999"
        },
        {
            id: 2,
            fName: "bbbbb",
            lName: "bbbbbbb",
            imgUrl: "https://media.licdn.com/mpr/mpr/shrinknp_200_200/bbb.jpg",
            email: "bbb@bbb-bbb.com",
            phone: "888888888888"
        },
        {
            id: 3,
            fName: "Number",
            lName: "Three",
            imgUrl: "http://3.bp.blogspot.com/-iYgp2G1mD4o/TssPyGjJ4bI/AAAAAAAAGl0/UoweTTF1-3U/s1600/Number+3+Coloring+Pages+14.gif",
            email: "three@ccccc.com",
            phone: "333-333-3333"
        }
    ];

    return contactList.map((contact) => {
        "use strict";
        return <ShortContact contact={contact} key={contact.id}/>
    });
}

ShortContact组件渲染：

class ShortContact extends React.Component {
    render() {
        return ( …

出于某种原因,当我明确地将显示设置为list-item并且list-style-type为square(光盘也不起作用)时,我无法使用标签显示项目符号

CSS:

#page1 dd
{

    display: list-item;
    list-style-type: square;
}

HTML:

      <dl>

        <dt>How does the game work? </dt>           
        <dd>It provides a process - a way to ask questions and find consensus-building answers through an interactive, web-based simulation.</dd>
        <dd>It creates a common language for discussing issues. </dd>
        <dd>It moves the conversation from an individual view to a systemic one. </dd>
      </dl>

这是浏览器中的样子.关于可能干扰代码的任何想法 - 在firebug中它表明它正确应用,但效果是不可见的.