A PHP Error was encountered

Severity: 8192

Message: Return type of CI_Session_files_driver::open($save_path, $name) should either be compatible with SessionHandlerInterface::open(string $path, string $name): bool, or the #[\ReturnTypeWillChange] attribute should be used to temporarily suppress the notice

Filename: drivers/Session_files_driver.php

Line Number: 132

Backtrace:

File: /home/infovistar/public_html/application/controllers/reactjs/Reactjs.php
Line: 7
Function: __construct

File: /home/infovistar/public_html/index.php
Line: 315
Function: require_once

A PHP Error was encountered

Severity: 8192

Message: Return type of CI_Session_files_driver::close() should either be compatible with SessionHandlerInterface::close(): bool, or the #[\ReturnTypeWillChange] attribute should be used to temporarily suppress the notice

Filename: drivers/Session_files_driver.php

Line Number: 292

Backtrace:

File: /home/infovistar/public_html/application/controllers/reactjs/Reactjs.php
Line: 7
Function: __construct

File: /home/infovistar/public_html/index.php
Line: 315
Function: require_once

A PHP Error was encountered

Severity: 8192

Message: Return type of CI_Session_files_driver::read($session_id) should either be compatible with SessionHandlerInterface::read(string $id): string|false, or the #[\ReturnTypeWillChange] attribute should be used to temporarily suppress the notice

Filename: drivers/Session_files_driver.php

Line Number: 166

Backtrace:

File: /home/infovistar/public_html/application/controllers/reactjs/Reactjs.php
Line: 7
Function: __construct

File: /home/infovistar/public_html/index.php
Line: 315
Function: require_once

A PHP Error was encountered

Severity: 8192

Message: Return type of CI_Session_files_driver::write($session_id, $session_data) should either be compatible with SessionHandlerInterface::write(string $id, string $data): bool, or the #[\ReturnTypeWillChange] attribute should be used to temporarily suppress the notice

Filename: drivers/Session_files_driver.php

Line Number: 235

Backtrace:

File: /home/infovistar/public_html/application/controllers/reactjs/Reactjs.php
Line: 7
Function: __construct

File: /home/infovistar/public_html/index.php
Line: 315
Function: require_once

A PHP Error was encountered

Severity: 8192

Message: Return type of CI_Session_files_driver::destroy($session_id) should either be compatible with SessionHandlerInterface::destroy(string $id): bool, or the #[\ReturnTypeWillChange] attribute should be used to temporarily suppress the notice

Filename: drivers/Session_files_driver.php

Line Number: 315

Backtrace:

File: /home/infovistar/public_html/application/controllers/reactjs/Reactjs.php
Line: 7
Function: __construct

File: /home/infovistar/public_html/index.php
Line: 315
Function: require_once

A PHP Error was encountered

Severity: 8192

Message: Return type of CI_Session_files_driver::gc($maxlifetime) should either be compatible with SessionHandlerInterface::gc(int $max_lifetime): int|false, or the #[\ReturnTypeWillChange] attribute should be used to temporarily suppress the notice

Filename: drivers/Session_files_driver.php

Line Number: 356

Backtrace:

File: /home/infovistar/public_html/application/controllers/reactjs/Reactjs.php
Line: 7
Function: __construct

File: /home/infovistar/public_html/index.php
Line: 315
Function: require_once

A PHP Error was encountered

Severity: Warning

Message: ini_set(): Session ini settings cannot be changed after headers have already been sent

Filename: Session/Session.php

Line Number: 282

Backtrace:

File: /home/infovistar/public_html/application/controllers/reactjs/Reactjs.php
Line: 7
Function: __construct

File: /home/infovistar/public_html/index.php
Line: 315
Function: require_once

A PHP Error was encountered

Severity: Warning

Message: session_set_cookie_params(): Session cookie parameters cannot be changed after headers have already been sent

Filename: Session/Session.php

Line Number: 294

Backtrace:

File: /home/infovistar/public_html/application/controllers/reactjs/Reactjs.php
Line: 7
Function: __construct

File: /home/infovistar/public_html/index.php
Line: 315
Function: require_once

A PHP Error was encountered

Severity: Warning

Message: ini_set(): Session ini settings cannot be changed after headers have already been sent

Filename: Session/Session.php

Line Number: 304

Backtrace:

File: /home/infovistar/public_html/application/controllers/reactjs/Reactjs.php
Line: 7
Function: __construct

File: /home/infovistar/public_html/index.php
Line: 315
Function: require_once

A PHP Error was encountered

Severity: Warning

Message: ini_set(): Session ini settings cannot be changed after headers have already been sent

Filename: Session/Session.php

Line Number: 314

Backtrace:

File: /home/infovistar/public_html/application/controllers/reactjs/Reactjs.php
Line: 7
Function: __construct

File: /home/infovistar/public_html/index.php
Line: 315
Function: require_once

A PHP Error was encountered

Severity: Warning

Message: ini_set(): Session ini settings cannot be changed after headers have already been sent

Filename: Session/Session.php

Line Number: 315

Backtrace:

File: /home/infovistar/public_html/application/controllers/reactjs/Reactjs.php
Line: 7
Function: __construct

File: /home/infovistar/public_html/index.php
Line: 315
Function: require_once

A PHP Error was encountered

Severity: Warning

Message: ini_set(): Session ini settings cannot be changed after headers have already been sent

Filename: Session/Session.php

Line Number: 316

Backtrace:

File: /home/infovistar/public_html/application/controllers/reactjs/Reactjs.php
Line: 7
Function: __construct

File: /home/infovistar/public_html/index.php
Line: 315
Function: require_once

A PHP Error was encountered

Severity: Warning

Message: ini_set(): Session ini settings cannot be changed after headers have already been sent

Filename: Session/Session.php

Line Number: 317

Backtrace:

File: /home/infovistar/public_html/application/controllers/reactjs/Reactjs.php
Line: 7
Function: __construct

File: /home/infovistar/public_html/index.php
Line: 315
Function: require_once

A PHP Error was encountered

Severity: Warning

Message: ini_set(): Session ini settings cannot be changed after headers have already been sent

Filename: Session/Session.php

Line Number: 375

Backtrace:

File: /home/infovistar/public_html/application/controllers/reactjs/Reactjs.php
Line: 7
Function: __construct

File: /home/infovistar/public_html/index.php
Line: 315
Function: require_once

A PHP Error was encountered

Severity: Warning

Message: session_set_save_handler(): Session save handler cannot be changed after headers have already been sent

Filename: Session/Session.php

Line Number: 110

Backtrace:

File: /home/infovistar/public_html/application/controllers/reactjs/Reactjs.php
Line: 7
Function: __construct

File: /home/infovistar/public_html/index.php
Line: 315
Function: require_once

A PHP Error was encountered

Severity: Warning

Message: session_start(): Session cannot be started after headers have already been sent

Filename: Session/Session.php

Line Number: 143

Backtrace:

File: /home/infovistar/public_html/application/controllers/reactjs/Reactjs.php
Line: 7
Function: __construct

File: /home/infovistar/public_html/index.php
Line: 315
Function: require_once

React for Beginners | Props
For any queries you can reach us at infovistarindia@gmail.com / WhatsApp us: +919158876092

React for Beginners | Props

Components can be passed values using props

  • Data passed to components in JavaScript are called props
  • Props look identical to attributes on plain JSX/HTML elements, but you can access their values within the component itself
  • Props are available in parameters of the component to which they are passed. Props are always included as properties of an object
ReactDOM.render(
    <Greeting username="Infovistar" />
    document.getElementById("root")
);

function Greeting(props) {
    return <h1>Hello {props.username}</h1>;
}

Props cannot be directly changed

  • Props must never be directly changed within the child component.
  • Another way to say this is that props should never be mutated, since props are a plain JavaScript object.
// We cannot modify the props object:

function Header(props) {
    props.username = "Junaid";


    return <h1>Hello {props.username}</h1>;
}
Components are consider pure functions. That is, for every input, we should be able to expect the same output. This means we cannot mutate the props object, only read from it.

Special props: the children prop

  • The children prop is useful if we want to pass elements / components as props to other components
  • The children prop is especially useful for when you want the same component (such as a Layout component) to wrap all other components.
function Layout(props) {
    return <div className="container">{props.children}</div>;
}

function IndexPage() {
    return (
        <Layout>
            <Header />
            <Hero />
            <Footer />
        </Layout>
    );
}

function AboutPage() {
    return (
        <Layout>
            <About />
            <Footer />
        </Layout>
    );
    
}

The benefit of this pattern is that all styles applied to the Layout component will be shared with its child components.