javascript - 在 Material UI 的 <ListItem> 中的primaryText左侧添加一个图标

Question

我有一个<ListItem>来自 React Material UI，当前左侧有一个复选框。我想在复选框和标题之间(或者更确切地说，在标题左侧)添加一个图像/图标，在查看文档后，我不确定这是否可以实现。

我想做这样的事情:

这可以在 <Table> 中轻松实现具有多个行列 - ListItems 中有类似的东西吗？我明白了leftIcon在文档上，但它不起作用。

import Checkbox from 'material-ui/Checkbox'

render() {
    <ListItem 
        primaryText="autoblog.com" 
        leftCheckbox={<Checkbox />
        rightToggle={<div style={{display: 'none'}} />}
    />
}

Answer 1

试试这个，将图像放入leftCheckbox中:

leftCheckbox={  <div>
                    <Checkbox />
                    <img src='https://www.w3schools.com/css/img_fjords.jpg'/>
                </div>
}

应用 css 正确定位图像。

检查这个 fiddle 。