无论我做什么,我都无法改变选择的宽度。它始终保持不变,一些默认宽度(例如大约 75 像素)。
const Container = styled('div')`
width: 100%;
height: 100%;
display: flex;
flex-flow: row wrap;
justify-content: space-around;
`;
const selectStyles = {
valueContainer: base => ({
width: 300,
}),
group: base => ({
width: 300,
}),
container: base => ({
width: 300,
}),
control: base => ({
width: 300,
}),
singleValue: base => ({
width: 300,
}),
input: base => ({
width: 300,
color: theme.palette.text.primary,
'& input': {
font: 'inherit',
},
}),
}
return (
<SplitPane split='horizontal' defaultSize={260}>
<Paper
style={{ width: '100%' }}
>
<Container>
<Select
styles={selectStyles}
options={suggestions}
value={this.state.channel}
onChange={(value) => (this.setState({ channel: value }))}
/>
我做错了什么?
最佳答案
似乎您实际上是在寻找使 react 选择宽度在弹性盒设计(例如弹性增长)中正常运行的方法,在这种情况下请参阅此 reply ,但简而言之,您可以只使用这种样式:
const styles = {
container: base => ({
...base,
flex: 1
})
};
<Select styles={styles} />
关于javascript - 无法更改 react 选择元素的宽度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54224262/