相关疑难解决方法(0)

React - 在那里添加新元素后刷新数据列表的最佳做法是什么?

我正在构建一个简单的待办事项清单.我有一个用于添加新待办事项列表项的表单,并在其下列出待办事项列表中的所有项目.当我通过表单添加新项目时,我想刷新现有待办事项列表项目的列表.

Items.jsx:

class Items extends React.Component {
    constructor(props) {
        super(props);

        this.state = {
            items: [],
            loading: true
       };
    }

    componentDidMount() {
        axios.get('/api/v1/items')
            .then(response => {
            this.setState({ items: response.data, loading: false });
        });
        console.log('state.items: '+this.state.items);
    }

    componentDidUpdate() {
        axios.get('/api/v1/items')
            .then(response => {
            this.setState({ items: response.data, loading: false });
        });
        console.log('componentDidUpdate: '+this.state.items);
    }

    render() {
        return (
            <ItemSE.Group>
            {
                this.state.items.map(item => {
                    return <Item key={item.id} data={item} />
                })
            }
            </ItemSE.Group>
        );
    }
}

export default Items
Run Code Online (Sandbox Code Playgroud)

App.jsx:

class App extends Component { …
Run Code Online (Sandbox Code Playgroud)

javascript reactjs

8
推荐指数
1
解决办法
8087
查看次数

标签 统计

javascript ×1

reactjs ×1