react-typeahead-component icon indicating copy to clipboard operation
react-typeahead-component copied to clipboard

Support for react 0.14

Open mwilc0x opened this issue 8 years ago • 18 comments

Hi,

Thanks for making this component! I'm not sure if you've tested this with react 0.14 yet, or if you're planning to support it in the future? Right now it will not install due to peerDependencies using npm 2.x w/ react 0.14-betax

It will install with npm 3, but I haven't extensively tested it yet.

mwilc0x avatar Sep 09 '15 19:09 mwilc0x

I haven't test with the latest version yet. I definitely want to support the latest version of React. I wonder if it will still be broken once 0.14 is released? Is npm 3 currently out yet?

ezequiel avatar Sep 17 '15 04:09 ezequiel

:+1:

mitani avatar Sep 18 '15 21:09 mitani

:+1:

carlsverre avatar Oct 08 '15 02:10 carlsverre

:+1:

zawilliams avatar Oct 09 '15 04:10 zawilliams

image

logandhead avatar Oct 20 '15 18:10 logandhead

:+1:

bdart avatar Oct 30 '15 15:10 bdart

I am actually updating it to work with ReactJS 0.14 for transition. Which part is responsible that my input field is filled with my selection from the dropdown? Or more precisely how do you bind the clicked value to the input field?

bdart avatar Nov 02 '15 16:11 bdart

Waiting for this to be merged: #21

gustavoguichard avatar Nov 02 '15 23:11 gustavoguichard

@bdart i think that was managed by the "ref" on the renderInput but still is attached to the old behaviour of React 0.13

arzola avatar Nov 03 '15 14:11 arzola

@arzola @gustavoguichard I did nearly the same changes as @ezequiel

  focus: function() {
    ReactDOM.findDOMNode(this.refs.input).focus()
  },

the problem is that this change ends in that there is now error thrown but the focus event still does not happen. So the merge #21 just lags by the focus event for me actually

bdart avatar Nov 04 '15 17:11 bdart

Anyone already fixed the "ref" issue inside the render method?

arzola avatar Nov 04 '15 17:11 arzola

@arzola which issue do you mean explicit? I do not get any error in my version instead of that the focus event is not working

bdart avatar Nov 04 '15 19:11 bdart

Hi @bdart i got Uncaught Error: Invariant Violation: addComponentAsRefTo(...): Only a ReactOwner can have refs. You might be adding a ref to a component that was not created inside a component'srendermethod, or you have multiple copies of React loaded (details: https://fb.me/react-refs-must-have-owner).

I think it's because on the main Typeahead "render" method there are a references like this (see below), if i comment the "ref: input" the warnings dissapear but it does not works

React.createElement(Input, { ref: "input",

Works but break the next components in the stack

arzola avatar Nov 04 '15 21:11 arzola

Interestingly it does not cause any error for me. Whats about your package.json and the used versions? Maybe you have multiple instances of react running through your npm installation? But I do not think it have something to do with compatibility rather than a duplication.

Try to start from scratch and install this component than change dependencies to:

    "react": "^0.14.*",
    "react-dom": "^0.14.*",
    "react-mixin": "^1.1.*",
    "react-router": "^1.0.0-rc3",

Actually I do not know if all the three are needed but just to be sure. The versions are more important all over for an upgrade. After that go to your new created node_modules folder and change the three typeahead files the way the author did it here: #21

I actually reproduced it and it worked for me every time I rebuild it.

bdart avatar Nov 05 '15 10:11 bdart

@bdart when i run a npm ls | grep react i only got single React library loaded, as i said when i comment this:

<Input ref='input'

The "ref" input i avoid all of warnings and my another components works like a charm, but if i uncomment that line all is broken

arzola avatar Nov 06 '15 01:11 arzola

I have a different problem. On React 0.14.3, I can't type in the input field. I looked into it a little bit. Apparently, the default value property on the Input component is always set to blank, and always overrides anything that I type in there. So the input field always remains blank.

hellogerard avatar Dec 08 '15 21:12 hellogerard

I created a recent PR #29 which is a more complete update for React 14. It is not backwards compatible with v13 though.

I also have a scoped version published on npm @tappleby/react-typeahead-component which I am using until a PR w/ React 14 support gets merged.

tappleby avatar Dec 29 '15 01:12 tappleby

:+1:

cbrewer1689 avatar Jan 08 '16 01:01 cbrewer1689