反应调用Youtube上输入的退出

我试图使用youtubes API与you-tube-api搜索库，但我有一些麻烦得到新的搜索发生。反应调用Youtube上输入的退出

我创建了一个名为search_youtube的新函数，我想在用户退出输入时调用它。我现在设置的方式，当我加载html页面时，函数被连续调用。

什么是解决这个问题的恰当方法，以便在用户退出输入时呈现新的搜索。

class SearchBar extends Component { 
    constructor(props) { 
    super(props) 

    this.state = { 
      videos: [], 
      selectedVideo: null 
     } 
    } 

    searchYoutube(event) { 
    console.log("called") 
    YTSearch({ key: API_KEY, term: event.target.value }, (videos) => { 
     this.setState({ 
     videos: videos, 
     selectedVideo: videos[0] 
     }) 
    }); 
    } 

    render() { 
    return(
     <div className="search-bar"> 
     <input onBlur={this.search_youtube(event)} /> 
     </div> 
    ) 
    } 
}

来源

2017-06-17 adamscott

根据[react-docs]（https://facebook.github.io/react/docs/events.html#focus-events）''''''onBlur'''应该是你之后...这个显然不工作？ – archae0pteryx

他们正在装载每次你加载你的页面，因为它是你的渲染功能里面，您所调用的函数，而不是传递函数的onblur，该行改成这样：

<input onBlur={event => this.search_youtube(event)} />

观测值。如果你想了解更多关于箭头功能请查看article。

来源

2017-06-18 00:20:59

反应调用Youtube上输入的退出

回答

相关问题