繁体   English   中英

如何在 React 中将经典组件转换为功能组件

[英]How to convert classical component to functional component in React

请建议如何使用react js在功能组件中编写constructor函数......因为我计划将类组件转换为功能组件......任何人都可以帮忙

import React, { Component } from "react";
class Example extends Component {
  constructor(props) {
    super(props);
    this.state = {
      users: []
    };
  }
  componentDidMount() {
    axios
      .get("https://www.example.com/users/id")
      .then(response => {
        this.setState({ descriptions: response.data });
        // console.log(response.data)
      })
      .catch(error => {
        console.log(error);
      });
  }
  render() {
    const { users } = this.state;
    return <div>Data</div>;
  }
}
export default Example;

为了在功能组件中使用状态或生命周期方法,您应该使用 React Hooks

import React, { useState, useEffect } from 'react';

const Example =() => {
 const [users, setUsers] = useState([])
 useEffect(()=> {
    axios.get("https://www.example.com/users/id")
            .then(response => {
               // use setState hook here
                // console.log(response.data)
            })
            .catch(error => {
                console.log(error)
            })
 }, [])   

 return (
            <div>
              Data
            </div>
         )
}
export default Example

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM