我正在使用this link中的代码来切换语言,但是我尝试对其进行调整以使用实质性的UI组件进行样式设置。更改语言是可行的,但是每次更改都会使我回到主页,因为与原始代码中的选择不同,我使用的# features/support/env.rb
require 'selenium-webdriver'
Capybara.register_driver :chrome do |app|
options = Selenium::WebDriver::Chrome::Options.new(args: %w[no-sandbox])
options.headless! if tddium?
Capybara::Selenium::Driver.new(app, browser: :chrome, options: options)
end
Capybara.javascript_driver = :chrome
组件不接受MenuList
道具。
我的问题是:如何在该第三方组件中传递onChange
道具?
原始代码:
onChange
我的变体因为MenuList不接受import React, { Component } from 'react'
import PropTypes from 'prop-types'
class Language extends Component {
static contextTypes = {
language: PropTypes.object,
}
state = {
value: '',
}
componentDidMount() {
const { language } = this.context
this.setState({
value: language.locale || language.detected,
})
}
handleChange = event => {
const { language } = this.context
const { originalPath } = language
const { value } = event.target
if (value === this.state.value) {
return
}
this.setState({ value }, () => {
localStorage.setItem('language', value)
window.location.href = `/${value}${originalPath}`
})
}
render() {
const { language } = this.context
const { languages } = language
const { value } = this.state
if (!value) {
return null
}
return (
<select value={value} onChange={this.handleChange}>
{languages.map(({ value, text }) => (
<option key={value} value={value}>
{text}
</option>
))}
</select>
)
}
}
export default Language
道具而不能真正起作用:
onChange
您可以在codesandbox中签入,这里的重要文件是src / component / language.js:https://codesandbox.io/s/mo75j2jxyx
答案 0 :(得分:1)
MenuItem具有一个onClick
道具。您可以使用它。点击事件处理程序可以是这样的:
handleClick = event => {
const { value } = event.currentTarget;
};
您可以参考here for Menu examples。