blueberryapps / react-load-script

React component that makes it easy to load 3rd party scripts

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Loading multiple, dependent scripts

stsomewheredesign opened this issue · comments

Is it possible to load multiple, dependent scripts prior to executing any code in the handleScriptLoad() as shown in the example?

I tried using multiple <Script /> blocks in the desired dependency order, but that didn't seem to work out quite as expected.

I thinke one way is to chain multiple Script tags in your render function, loading one at a time depending on the previous loaded state. This seems needlessly tricky, though.

This is a pretty big pain right now, especially for projects like tinymce where you might be using a handful of plugin scripts.

@reverie - did you ever get this working? I'm chaining 2 scripts using state to trigger re renders and only the first is being rendered.

I've managed to make it work by changing the key props on the second script

<Script
 url={`https://firstScript`} 
 onLoad={this.onFirstScriptLoaded} 
/>
/* state dependent rendering */
<Script 
 key="secondScript" 
 url={`https://secondScript`} 
 onLoad={this.onSecondScriptLoaded} 
/>

I guess react thinks that the script component is the same and should not be updated so specifying a key props forces render