在 React 中从 firebase 获取数据时出现空白行

Question

所以当我像这样从 firebase 获取数据时有空行：

console log in render 显示数据但无法在线显示。

操作：

export function fetchInputs() {
return dispatch => {
    firebase_db_fetch.on('value', snapshot => {
        dispatch({
            type: FETCH_INPUTS,
            payload: snapshot.val()
        });
    });
};
}

正在尝试渲染：

renderInputs() {
    return _.map(this.props.inputs, input => {
        return 
            <li className="list-group-item" key={this.inputs} >
                {this.inputs}
            </li>
        );
    });
}

并在 class、

<div>
    <h3 className="h3Popis">Popis stavki:</h3>
        <ul className="list-group">
            {this.renderInputs()}
        </ul>
</div>

还有一个警告：

Warning: Each child in an array or iterator should have a unique "key" prop. Check the render method of InputsIndex

那么如何在线渲染数据呢？谢谢评论！

Answer 1

您是否尝试过将另一种类型的值放入键中？现在你有数组。尝试字符串或数字

Answer 2

问题出在呈现每一行的辅助函数中，this.props.input；

想参考我自己问的类似问题：

我认为它对渲染整个对象或该对象的特定值有很好的帮助！

在 React 中从 firebase 获取数据时出现空白行

Blank line when fetching data from firebase in react

javascript

reactjs

firebase

blank-line