Question

我有一个名为items的组件，在这个组件中，我向服务器发出请求以加载项目的数据。

现在，当我刷新页面时，页面不会显示已加载的项目。

有人可以帮助我理解或解决此问题，以便在刷新页面时也可以看到这些项目。

我是否在生命周期挂钩中缺少某些内容（didupdate左右）？谢谢。

下面是代码，

export default Items extends react.PureComponent {
    constructor(props) {
        super(props);
        this.state = {
            items: [],
        };
    }

    componentDidMount() {
        if (this.props.items.length > 0) {
            this.load_items_data();
        }
    }

    componentDidUpdate(prevProps) {
        if (this.props.items !== prevProps.items && 
            this.state.items.length === 0) {
            this.load_items_data();
        }
    }

    render = () => {
        return ( 
            {this.state.items.map((item) => {
                            return (
                                <tr key={item.id}>
                                    <td>{item.name</td>
                             );
            }
        );
     }
}

Answer 1

看这里https://reactjs.org/docs/lists-and-keys.html

下面，我们使用JavaScript map（）遍历numbers数组   功能。我们为每个项目返回

元素。最后，我们分配   结果元素数组到listItems：

vw

我们将整个listItems数组包含在一个元素中，并且渲染到DOM：

const numbers = [1, 2, 3, 4, 5];
const listItems = numbers.map((number) =>
  <li>{number}</li>
);

为什么直接使用url加载页面不会使用react显示数据？

1 个答案: