score:1
Accepted answer
i would keep the spinner ressource link in a conf file, render all my components passing the url through props.
so when i decide to change the spinner for another one i'll just have to change the link in the conf file.
mixin could work but i'm not sure this is the best thing to share just a prop
edit: var conf = require("myconfmodule");
inside you parent components render function:
render: function() {
<somecomponent spinnerurl={conf.spinnerurl} />
}
inside your child component:
getinitialstate: function() {
return { isloaded : false; };
}
render: function() {
{ !this.state.isloaded ?
<img src={this.props.spinnerurl} />
: <loadthepage/>}
}
componentdidmount: function() {
// some listener, is my page load ? then this.setstate({
// isloaded: true });
}
i was thinking about something like that, let me know if it's clearer.
Source: stackoverflow.com
Related Query
- Is there any way add a global spinner in React?
- Is there any way to see names of 'fields' in React multiple state with React DevTools when using 'useState' hooks
- Is there any proper way to integrate d3.js graphics into Facebook React application?
- is there any way to disable or speed up React PropType validation in development mode?
- Is there any way to detect middle click in React JS?
- Is there any way to make React Material-UI radio buttons required
- Is there any way to hide the params from the query string in react routing?
- Detecting Control + D in my code also triggers add bookmark keyboard shortcut in Chrome, is there any way to prevent this?
- is there any way to add table in "react-pdf"?
- Is there any way to crop videos in JavaScript with a crop box, without using React or Vue?
- Is there any way to scroll to a particular child in react sortable tree?
- Is there a way to add border on a table of react component?
- Is there any way to get props in React class other than in render method?
- is there any way to stick on the same page even after refreshing in react router?
- Is there any way to stop on hydration React App in Cypress?
- is there a way to add a <label></label> to every column header using Material Table React
- Creating React apps using npx create-react-app is very slow , Is there any way to speed it up?
- Is there any way to dynamically add JSON fields in Javascript?
- When testing a React component, is there any way to directly call its non-lifecycle methods?
- Is there a way to add different fonts to different properties in Typography using material ui @next React
- Is there any other way to add attributes to a component in React?
- is there a way to add custom html inside the Popconfirm in antd and React
- Is there any better way to set function to react hooks useState?
- Is there any way to play a sound for a certain time interval when a onClick method is triggered on react js
- Is there a way in React to save something in state without using any hooks?
- Is there any way to set a default value for cells when adding a new row in react material-table?
- Is there any way to block user navigation with out any prompt in react
- Is there any way to define the datatype of value in state of hooks in functional component of react JS?
- Is there any way that I can run child_process in electronjs and send json file to react that is being created by that child_process?
- Is there any way to change image within a time period in react JS
More Query from same tag
- Assign user property to variable in firebase and react
- Draw dynamic circle in gatsby react issue
- How to get multiple children to set one parent state without overwriting each other react js
- How do I turn a JSX Element into a Function Component in React?
- How to use conditional rendering by creating custom division returning functions with onClick attribute in submit button in React?
- Pass props to react component wrapped in variable
- react font awesome renders big icon until scales down
- Why is my state array resetting to empty?
- How can we upload multiple files using React.JS ? When we click on the upload button all the names of the selected files must appear
- React - Change button to loading status whilst fetching data
- Scroll on Dropdown of antD component React
- call forceUpdate() on component when redux state updates
- action does not call reducer
- How to disable the css changes made by Link/href
- React Share variables between components
- Months range filter react
- Render card details on another page when clicking specific card
- Pass the element itself as an onClick parameter instead of an instance of a class
- How do I create a HTTP post using React/Typescript Frontend and C#/.Net Backend?
- How to pass props to the inputComponent material-ui?
- Is there a way to force eject a react app?
- React Router Redirect state is undefined when used in Protected Route
- React Table set Header onClick-Function without disable sort-Function
- Mapping by Object Key Returns 0?
- How to put React.Component to CSS content property (in :before/:after pseudo-elements)?
- How to set a footer section to stay at the bottom unless there is extra content and we need to scroll to see it using flex
- How can I get image value and implement on any another div in react?
- Cant access key values from an Object in Reactjs after fetching
- Getting all 42 days that appear on a calendar month in a single array using moment.js
- In Sublime Text 3, how do you enable Emmet for JSX files?