score:0
in your componenent you used componentdidmount to fetch data.
you could the useeffect hook in your function to have the same effect
https://reactjs.org/docs/hooks-effect.html
useeffect takes two parameters, a function that gets called and a dependencies array.
if you pass in an empty array into as dependencies, your function gets only called on after your function gets mounted
const [assettype, setassettype] = usestate(null)
useeffect( () => {
assettypeservice.getassettypebyid(assettype_assettypeid).then((res) => {
setassettype(res.data);
});
}, [])
if(!assettype)
return (<ul>loading...</ul>
return (<ul>assettype.assettypename</ul>)
score:1
new function code:
...
import react, { usestate, useeffect} from 'react';
import assettypeservice from './assettypeservice'
function getassettypenamefunction() {
const [assettype, setassettype] = usestate(null)
useeffect( () => {
assettypeservice.getassettypebyid(assettype_assettypeid).then((res) => {
setassettype(res.data);
});
}, []);
if(!assettype)
return (<ul>loading...</ul>)
return (<ul>assettype.assettypename</ul>);
}
export default getassettypenamefunction;
...
Source: stackoverflow.com
Related Query
- Reactjs refactoring a component to a function
- ReactJS lifecycle method inside a function Component
- How to pass a function as an argument to a ReactJS component in TypeScript
- ReactJS component PropTypes - specify a function type with a set number parameters
- How to call another component from onClick function in ReactJS
- ReactJS children component lost its state when rendered with a different function
- ReactJs Component is rendered before cordovas onDeviceReady function
- ReactJS Router- How to use history push within function component with parameters?
- Call a function in a sibling component Reactjs
- ReactJS - Return a component from innerHtml function
- ReactJS add callback function to children component
- ReactJS component onClick not firing own function
- Passing a function to Child Component through a Prop using ReactJS
- Reactjs trigger onClick function without click in functional component
- How to access reactjs component state in jquery callback function
- ReactJs - Input Component behaves strangely when its returned from a function
- Function inside component - ReactJS
- Need Reactjs help on how to properly pass this function from the parent to child button component
- Call server-side function from ReactJS component
- ReactJs functional component add function to an eventListener and then invoke it
- In ReactJS how would I bind "this" to the parent component inside a map() function
- Calling A Child Component Inside a Map Function In ReactJs
- Unable to pass function to a child component in ReactJS
- Refactoring a Component ReactJS
- pass function argument to another component reactjs
- Call a method from another Component after the Async function reactjs
- Passing a function to child component in reactjs
- ReactJS Component function call this and props undefined
- Using the returned value of an ordinary function insdie a ReactJS component
- Reactjs map function does not render the component
More Query from same tag
- Toggling a recursive fetch request based on React state using `useEffect`
- Get the height of an children element
- Stack with style in react js
- How to target specific element after mapping and passing onClick function as props
- react-router prepending POST request to URL
- How do I combine disabled days using react-day-picker-input
- Change state of another component in React
- React, getting undefined as result while using useContext
- Set i18next language based on HTML tag
- dilemma of using "createHashHistory" vs "createBrowserHistory" incontext of deployment
- React - How to specify an icon in an object as a value
- How to add an image slider for each react bootsrap card in a Card Deck
- Issue in react context api
- React | Multiple Context | Not able to consume default values
- Simple Redux Counter Component implementation
- Moving the google map according to the marker
- React gradient slider (rating component) with rounded corners
- React Hooks: Set All State Values to the Same Values with useState
- Make div go to next column everry time it's value is divisible by 5
- How to create a React component for a bootstrap alert?
- pdf file not opening in browser
- React, using Hooks to create component
- Can't read list entry in immutable record
- Next.js Loads <script> tags but it doesn't execute them
- Nginx configuration issue with https on windows
- reducer switch statements not working
- Use MaterialUI pseudo-classes selectors with makeStyles
- How to add Multiple Buttons in AppBar using iconElementRight
- How can I exclude the past (past days) using moment js?
- onClick called repeatedly (not supposed to) when component re-renders