Kevin Powell - CommunityKP-C
Kevin Powell - Community2y ago
50 replies
vic

how to render a component by clicking in reactjs ?

I want to render a component by clicking?

Here's the code
I want to display that language component when I click button from that user.jsx and only render language component and disappear that user component
Language.jsx
js 

import React from 'react';
export function Language({ usedetails }) {
  return <h1> Welcome {usedetails} </h1>;
}


User.jsx
import React, { useState } from 'react';
import { Language } from './Language';

export function User() {
  const [usedetails, setUsedetails] = useState('');

  function redirect12() {
    <Language usedetails={usedetails}
}

  return (
    <div>
      <input
        type='text'
        onChange={(e) => setUsedetails(e.target.value)}
      />
      <button onClick={redirect12}>Next</button>

    </div>
  );
}

App.jsx 
js

import React from 'react';
import { User } from './User';

export function App() {
return (
<div>
<User />
</div>
);
}

Was this page helpful?