Question

我在一个React项目中，其中在axios.get之后，我在axios.get 之前的一个空UL中得到了许多LI。当在axios.get之后显示LI时，我要单击一个LI，以将LI值发送到输入值。我知道如何使用Jquery来做到这一点（例如：http://jsfiddle.net/Ender/QdWxH/和http://jsfiddle.net/kbFUu/1/），但是我不知道如何在React中做到这一点 ...有人帮帮我吗？

在我的 src / App.js 中，我获得了功能

getValueFromLi = (evt) => {
  $('.App-Result-Li').on('click',function() {
    var content= $(this).text();
    $('.App-Form-Trips-cityDeparture').val(content);
  });
}

和 src / components / Results / index.js （不用担心，我对道具做得很好，等等），我得到了回调

<li
   onClick={getValueFromLi}
   data-value={city.local_name}
   className="App-Result-Li"
 >

你知道我做错了什么吗？

我的项目在Github上： https://github.com/Versifiction/api-tictactrip

涉及的文件： src / App.js（https://github.com/Versifiction/api-tictactrip/blob/master/src/App.js）＆src / components / Results / index.js（https://github.com/Versifiction/api-tictactrip/blob/master/src/components/Results/index.js）

非常感谢您！

Answer 1

也许您可以尝试这样：

<li
   onClick={() => this.provideLocalName(city.local_name)}
   data-value={city.local_name}
   className="App-Result-Li"
 >

此外，您可以在getValueFromLi函数中解析事件对象，然后对其进行处理，例如

getValueFromLi = e => {
  console.log('li element: ', e.target)
  // do something with li, now you have reference to the dom node
}

<li
   onClick={this.getValueFromLi}
   data-value={city.local_name}
   className="App-Result-Li"
 >

在React中的另一个输入值中发送LI值

1 个答案: