0

I am new to Reactjs. Recently I created a simple typing app using reactjs. In fact, I built that App from my previous PHP project. I need to include my custom javascript file to my reactjs app.

My Home.js file is

import React from 'react';
import {Link} from 'react-router-dom';

function Home() {
    return (
<form name="post" method="POST">
              <div class="form-group form-row">
                <div class="col-sm-2 col-md-12">
                  <div class="custom-control custom-radio custom-control-inline">
                    <input type="radio" id="customRadio1" class="custom-control-input" onclick="toggleKBMode(event,this)"/>
                    <label class="custom-control-label" for="customRadio4">One<br/></label>
                  </div>
                  <div class="custom-control custom-radio custom-control-inline">
                    <input type="radio" id="customRadio2"class="custom-control-input" onclick="toggleKBMode(event,this)"/>
                    <label class="custom-control-label" for="customRadio1">Two<br/></label>
                  </div>
                  <div class="custom-control custom-radio custom-control-inline">
                    <input type="radio" id="customRadio3"class="custom-control-input" onclick="toggleKBMode(event,this)"/>
                    <label class="custom-control-label" for="customRadio1">Three<br/></label>
                  </div>
                  <div class="custom-control custom-radio custom-control-inline">
                    <input type="radio" id="customRadio4"class="custom-control-input" onclick="toggleKBMode(event,this)"/>
                    <label class="custom-control-label" for="customRadio1">Four<br/></label>
                  </div>
                </div>
              </div>
              <div class="form-group"><textarea name="comment" class="form-control" id="TextArea" onkeydown="toggleKBMode(event)" onkeypress="javascript:convertThis(event)" autofocus=""></textarea></div>
           
                <div class="col-md-9">
                  <button type="submit" class="btn btn-outline-primary" onclick="DFile()" aria-label="Download"><b>Download</b></button>
                  <button type="submit" class="btn btn-secondary" id="Tools" onclick="copyToClipboard()"><b>Clip</b></button>
                </div>
            </form>
);
}

export default Home;

My App.js file is

import Home from './system/pages/Home';
import {BrowserRouter as Router, Route, Switch} from 'react-router-dom';

function App() {
    let script = document.createElement("script");
    script.src = "/include/js/customTextAreafunction.js";
    //You might have to add other attributes here 
    script.async = true; //So the script load does not block anything
    document.body.appendChild(script);
  return (
    <Router>
    <div className="container">

    <Switch>
    <Router exact path="/">
    <Home/>
    </Router>
    </Switch>

    </div>
    </Router>
  );
}

export default App;

But I want to add this custom javascript file into my project, which is helping for Textarea functioning.

Custom js file I want to include reactjs App

<script src="/include/js/customTextAreafunction.js"></script>

So kindly please help me to fix this. Thanks in advance.

App.js is edited recently but didn't work. Kindly please help my project.

1 Answer 1

2

If you want to edit your index.html, you can copy/paste your script tags there.

Or you can wait for component mount in App.js and fetch it:

let script = document.createElement("script");
script.src = "/include/js/customTextAreafunction.js";
//You might have to add other attributes here 
script.async = true; //So the script load does not block anything
document.body.appendChild(script);

Sign up to request clarification or add additional context in comments.

1 Comment

Can I insert this into my index.js or App.js file?

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.