React LinkedStateMixin с геокомпонентом

Question

В настоящее время используется Rails 4 с react-rails gem и geocomplete gem.

Все работало отлично (ish), пока я не изменил переднюю часть, чтобы использовать Reactjs. Когда я печатаю несколько символов, появляется список автозаполнения. Я выбираю местоположение, но только несколько символов отображаются в моем государстве. Пример: Когда я набираю «bir», отображается список для «Бирмингема». Если я выберу «Бирмингем, Соединенное Королевство», останется только «bir», почему?

js.jsx:

var NewProject = React.createClass({ 
    mixins: [React.addons.LinkedStateMixin], 

    getInitialState: function() { 
    return { 
     location: this.props.data.location 
    } 
    }, 

    render: function(){ 
    $("#location").geocomplete({ details: "form" }); 
    return <input type="text" id="location" valueLink={this.linkState('location')} />; 
    } 
}); 

Как получить полное значение строки при выборе независимо от того, если я напечатал несколько символов?

Answer 1

Проблема заключается в том, что геокомплект делает некоторую магию для ввода, которая не очень хорошо работает с тем, как React наблюдает за изменением поля. Я бы попытался использовать другое решение для автозаполнения, но если вам нужно придерживаться геокомплекта, вы можете попытаться использовать jquery + простой метод onChange для обнаружения изменений в поле. Что-то вроде этого:

var NewProject = React.createClass({ 
 

 
    getInitialState: function() { 
 
    return { 
 
     location: this.props.data.location 
 
    } 
 
    }, 
 
    
 
    onGeoChange: function(e) { 
 
    this.setState({ 
 
     location: $("#location").val() 
 
    }); 
 
    }, 
 

 
    render: function(){ 
 
    $("#location").geocomplete({ details: "form" }); 
 
    return <input type="text" id="location" onChange={this.onGeoChange} />; 
 
    } 
 
});