reactjs - TypeError:无法读取反应js中未定义的属性“替换”
问题描述
这是我在反应组件中的 html 代码:
<a className="nav-link" href="#" onClick={this.handleExit}>
<img
src={require("../data/btn-ex.png")}
style={{ width: "70px" }}
alt="btn"
/>
</a>
这是我使用注销的功能:
handleExit = e => {
e.preventDefault();
if (window.confirm("برای خروج اطمینان دارید؟")) {
this.props.history.replace("/logout");
}
};
但这不起作用
const require = () => 'https://api.adorable.io/avatars/285/abott@adorable.png'
class App extends React.Component {
handleExit = e => {
e.preventDefault();
if (window.confirm("برای خروج اطمینان دارید؟")) {
this.props.history.replace("/logout");
}
};
render () {
return (
<a className="nav-link" href="#" onClick={this.handleExit}>
<img src={require("../data/btn-ex.png")} style={{
width: "70px"
}} alt="btn"/>
</a>
)
}
}
ReactDOM.render(<App />, document.getElementById('root'));
<script crossorigin src="https://unpkg.com/react@16/umd/react.development.js"></script>
<script crossorigin src="https://unpkg.com/react-dom@16/umd/react-dom.development.js"></script>
<div id="root"></div>
解决方案
这是很好的工作
import React, { Component } from "react";
import { Link } from "react-router-dom";
class Navbar extends Component {
render() {
return (
....
<Link className="nav-link" to="/dashboard/logout">
<img
src={require("../data/btn-ex.png")}
style={{ width: "70px" }}
alt="btn"
/>
</Link>
...
);
}
}
export default Navbar;
推荐阅读
- php - Wordpress:如何覆盖特定的更新通知
- node.js - 构建 webpack.dll 时找不到 Nodejs NPM 模块
- python - 从数据框中删除行并重置索引
- python - 在python中将数据框转换为嵌套的json
- swift - 创建一个 React-Native 桥接 iOS 类的实例
- cassandra - Flink Cassandra sink 导致背压
- html - Angular 检测 dom-to-image 的变化并无限次渲染
- python - 以整数为参数并返回对应月份和年份的函数
- kubernetes - 我在部署 pod 时收到错误“networkPlugin cni failed to setup pod”
- android - 如何将 alac 解码器注册到多媒体框架?