简体   繁体   English

Autosuggest react.js组件不会在渲染时更新输入样式

[英]Autosuggest react.js component won't update input style on render

I'm using the react-autosuggest component and I'm styling the border of input part of it with a react inline style which changes based on user input. 我正在使用react-autosuggest组件,并使用基于用户输入而变化的react内联样式来设置其输入部分的边框样式。 However, despite the new style being passed to the Autosuggest component every time render() is called, it's not updated. 但是,尽管每次调用render()都会将新样式传递给Autosuggest组件,但它不会更新。 Here's what I have: 这是我所拥有的:

 var borderStyle; if (gradient) { borderStyle = { borderImageSlice: 1, borderImage: '-webkit-linear-gradient(right, '+borderColour2+' 0%, '+borderColour2+' 40%, '+borderColour1+' 60%, '+borderColour1+' 100%) 1' }; } else { borderStyle = { 'borderColor': borderColour1 }; } var theme = { container: 'react-autosuggest__container', containerOpen: 'react-autosuggest__container--open', input: borderStyle, suggestionsContainer: 'react-autosuggest__suggestions-container', suggestion: 'react-autosuggest__suggestion', suggestionFocused: 'react-autosuggest__suggestion--focused', sectionContainer: 'react-autosuggest__section-container', sectionTitle: 'react-autosuggest__section-title', sectionSuggestionsContainer: 'react-autosuggest__section-suggestions-container' }; <Autosuggest suggestions={suggestions} theme={theme} onSuggestionsUpdateRequested={this.onSuggestionsUpdateRequested} getSuggestionValue={getSuggestionValue} renderSuggestion={renderSuggestion} inputProps={inputProps} ref={this.saveInput} onSuggestionSelected={this.selectCard} /> 
I'm using default values for everything but input. 我正在使用除输入以外的所有内容的默认值。 I know the styling works because I gave it a hardcoded gradient and on first page load it displays it just as I want. 我知道样式有效,因为我给了它一个硬编码的渐变,并在第一页加载时按我的意愿显示它。 I also know the value of 'borderstyle' is correct and updated when it's passed into theme , and therefore when theme is passed into the component to be rendered. 我也知道'borderstyle'的值在传递给theme时是正确的,并且会更新,因此在将theme传递给要渲染的组件时也是如此。

这应该在版本3.5.1中修复。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM