React how can i add 'ref' to dom out of render?

Question

the exmcode is here

mines[i] = (
  <p key = {i} ref = {i}></p>
  );
  .....
  render(
      return(
          {mines}
      )
  )

when i render it on my page ,

(actually i added a click function first,the "mines" changed when i click the button)

the browser call error

addComponentAsRefTo(...): Only a ReactOwner can have refs. You might be adding a ref to a component that was not created inside a component's render method, or you have multiple copies of React loaded.

how can i do

Please take a look at this - http://stackoverflow.com/questions/28519287/what-does-only-a-reactowner-can-have-refs-mean — Arshabh Agarwal, Mar 08 '17 at 14:18
If you want to display a list of items you should follow the official docs, there you´ll find everything you need, you display a list you have to use "map" in ordner to loop through your items https://facebook.github.io/react/docs/lists-and-keys.html — Christian Stengel, Mar 08 '17 at 14:31

score 0 · Answer 1 · answered Mar 08 '17 at 13:14

0

Cant you put this inside render, but before return? Something like that:

  render(
      mines[i] = (
        <p key = {i} ref = {i}></p>
      );
      return(
        <div className="wrapper">
          {mines}
        </div>
      )
  )

answered Mar 08 '17 at 13:14

Robsonsjre

1,586
11
17

maybe it's one of the solution,but i want to put it outside if could . btw thank you – yokeyang Mar 08 '17 at 13:21
Try to use a unique string to create your ref name: ref = { 'test-' + i } – Robsonsjre Mar 08 '17 at 15:11

React how can i add 'ref' to dom out of render?

1 Answers1