Tevin Thuku Tevin Thuku - 3 months ago 39
Javascript Question

React and stateless components

I saw this comment

You should really avoid having function allocations inside statelless components. Just keep them outisde the scope and pass the props, it’s a very big performance difference

from this post
https://medium.com/@housecor/react-stateless-functional-components-nine-wins-you-might-have-overlooked-997b0d933dbc#.18eyvtwu1

I was wondering if this is my component

```

const Text = (props) =>
<p>{props.children}</p>;

// ReactDOM is part of the introduction of React 0.14
ReactDOM.render(
<Text>Hello World</Text>,
document.querySelector('#root')


);

```

How do I access functions outside this file.? Which property should I use?

Answer

Just pass them as a prop.

function clickParagraph() {
  console.log('clicked!')
}

const Text = (props) =>
  <p onClick={props.onClick}>{props.children}</p>;


ReactDOM.render(
  <Text onClick={clickParagraph}>Hello World</Text>, 
  document.querySelector('#root')
);