我有一个导航组件,该组件使用Link,IndexLink来呈现导航栏:
class Navigation extends Component {
renderLinks = (linksData) => {
return linksData.map((link) => {
if(link.to === '/') {
return (
<li key={link.text}>
<IndexLink to={link.to}>
<i>{link.icon}</i>
<span>{link.text}</span>
</IndexLink>
</li>
);
} else {
return (
<li key={link.text}>
<Link to={link.to}>
<i>{link.icon}</i>
<span>{link.text}</span>
</Link>
</li>
);
}
});
};
render() {
const {links} = this.props;
return(
<div>
<ul>
{this.renderLinks(links)}
</ul>
</div>
)
}
}
Navigation.propTypes = {
links: React.PropTypes.array.isRequired
}
export default Navigation;
现在,我要测试链接是否正确呈现:
import React from 'react';
import {Link, IndexLink} from 'react-router';
import {mount} from 'enzyme';
import Navigation from '../components/core/Navigation.component';
describe('<Navigation/>', () => {
it('should render Navigation links', () => {
const links = [
{
to: '/',
icon: 'hourglass_empty',
text: 'Timer'
}
];
const navigation = mount(<Navigation links={links}/>);
console.log(navigation.find('a').prop('href'));
});
});
但这只是注销未定义。我如何测试正确的href值已传递给我的 anchor ?
最佳答案
试试这个:wrapper.find(Foo).at(0).props().href
关于react-router - component.find ('a).prop(' href')返回undefined而不是href值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41743041/