score:2
Accepted answer
i believe you're not using the url prop from the props, so lemme remove it and add url to state instead.
export function fileupload({
file,
ondelete,
onupload,
}: fileuploadprops) {
const [progress, setprogress] = usestate(0);
const [url, seturl] = usestate('');
useeffect(() => {
async function upload() {
url = await uploadfile(file, setprogress);
seturl(url) // this will set the state variable
onupload(file, url);
}
upload();
}, []);
if (!url) { // checking for empty url here.
return null;
}
return ( // this only gets returned when url is not empty
<grid item>
<fileheader file={file} url={url} ondelete={ondelete} />
<linearprogress variant="determinate" value={progress} />
</grid>
);
}
Source: stackoverflow.com
Related Query
- React wait for useEffect to finish before return
- How to wait for React useEffect hook finish before moving to next screen
- React Hooks - useReducer: Wait for reducer to finish before triggering a function
- Wait for multiple async calls to finish before React render
- REACT wait for useEffect to complete before rendering the UI
- How to wait for getDownloadURL to finish in my mapping function before updating my object array in react state?
- React Redux with Redux Observable wait for authentication action to finish before continuing
- React Hook Warnings for async function in useEffect: useEffect function must return a cleanup function or nothing
- React.js, wait for setState to finish before triggering a function?
- How to make Jest wait for all asynchronous code to finish execution before expecting an assertion
- ReactJs: How to wait for componentDidMount() to finish before rendering?
- Wait for CSS to load before JS in React [FOUC]
- How to wait for .map() to finish executing before continuing on to next lines of code
- Wait for API call data before render react hooks
- JS unit testing using enzyme: how to wait for setState within component's method to finish before proceeding with test case
- React - wait for promise before render
- React Hooks: how to wait for the data to be fetched before rendering
- Wait for a React Component to finish updating
- Wait for external script to load before the React component
- Wait for API data before render react hooks
- React with conditional promises chain and wait for them all before send dispatch
- React - Async api call, Promise.all wait for calls to finish
- React Flux - wait for props before rendering child components
- How to wait for data to finish fetching with async/await in React
- React Redux - Waiting for async api call to finish before next action is dispatched
- How can I wait for multiple promises to all be done before using their return data for another function call?
- How to wait for action to complete before redirecting in react redux?
- React wait for async function to finish in order to setup DOM references
- When testing a React component that renders fetched API data, how best to wait for that data before making any assertions?
- How to wait for a MYSQL query to finish before executing another using Node server?
More Query from same tag
- How to deploy browserHistory based React applications to Azure App Service?
- How can I use async / await functions?
- How can I avoid a TypeScript error with React useRef?
- mapStateToProps react router dom v6 useParams()
- onClick set state for parent of parent in React?
- Is there a function, like componentWillUnmount, that will fire before the page is refreshed
- How to make only one API request when using React SSR?
- Dynamic layout of React component from JSON
- React-Toolbox checkboxes inline
- Redux store reducers implement wrong interfaces
- Element positioned absolute inside Dialog Material UI React
- ReactJS: Download CSV File on Button Click
- Text field validation in material UI using error property
- React Js with PWA Blank Screen White on Safari Browser at first page reload
- Setting State and performing new Searches in React
- Add active class for onClick in reactjs
- How can I test weather I'm being navigated to the correct url or not using jest for react?
- Destructuring in React props, don't understand {...{ [resourceName]: item }} inside props
- How should I modify my css to make the image getting closer to my text when I narrow the browser?
- please explain the error to me, Error: Rendered more hooks than during the previous render
- React CSS-HTML align center with flex and image not showing small device
- How to install missing material-ui files in react
- How to pass value to props from component and set state
- how to make an infinite scroller / "Load More" in reactjs
- json manipulation use react js
- How to use i18next / react-i18next inside MDX / Markdown files with MDXJS?
- How to change the available values of a <Select> on input from another <Select>
- inline css and html tags in react gives Error
- i cant update the state in my parent component from my child (class) component
- How to trigger an event in React after an opened window closes