小编cod*_*ork的帖子

如何设置Material-UI的工具提示文本样式？悬停时的默认工具提示为黑色,没有文本换行.是否可以改变背景,颜色等？这个选项是否可用？

我正在创建一个Web应用程序,它将对OpenWeather API进行AJAX调用,以根据用户点击的城市获取城市的天气数据.

我正在使用React作为我的前端,Node.js/Express用于我的后端 - 但是我无法根据用户的点击实现如何进行API调用的正确设置.

如何重构我的代码以基于点击次数？

这是我到目前为止(JSBIN:http://bit.ly/1WedsL2 ) - 目前硬编码为"伦敦":

 var data = [
    {name: "London"},
    {name: "Tokyo"},
    {name: "NYC"}
];

var MusicBox = React.createClass({
    render: function() {
        return (
            <div className="musicBox">
                <h1>This is the music box</h1>
                <CityList data={this.props.data} />
            </div>
        );
    }
});

var CityList = React.createClass({
    getInitialState: function() {
        return {data: []};
    },
    componentDidMount: function() {
        $.ajax({
            url: 'http://api.openweathermap.org/data/2.5/weather?q=London,uk&appid=bd82977b86bf27fb59a04b61b657fb6f',
            method: 'GET',
            success: function(result) {
                this.setState({data: result});
            }.bind(this)
        });
    },
    render: function() {
        var cityNodes = this.state.data.map(function(city) …

我是刚接触React的新手，并且正在尝试将ParentComponent通过输入框（通过输入框）从用户输入中获取的值传递给它ChildComponent-我将使用用户输入值来运行AJAX调用。

我以为通过替换状态中的状态ParentComponent会起作用-但我仍然无法在状态中获取状态ChildComponent。

我也只希望ChildComponent仅在从接收到输入值后运行/渲染ParentComponent（这样我才能运行AJAX调用，然后渲染...）。

有小费吗？

var ParentComponent = React.createClass({
     getInitialState: function() {
         return {data: []};
     },

    handleSearch: function(event) {
        event.preventDefault();
        var userInput = $('#userInput').val();
        this.replaceState({data: userInput});
    },

    render: function() {
        return (
            <div>
                <form>
                    <input type="text" id="userInput"></input>
                    <button onClick={this.handleSearch}>Search</button>
                </form>
                <ChildComponent />
                {this.props.children}
            </div>
          );
        }
    });

var ChildComponent = React.createClass({
   render: function() {
        return <div> User's Input: {this.state.data} </div>
       }
   });