这是我的 html文件:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="style/style.css">
</head>
<body>
<button id="aa">another</button>
<button id="eng">English</button>
<div class="container"></div>
<div class="containerAA"></div>
</body>
<script src="bundle.js"></script>
<script src="index.js"></script>
<script src="indexAr.js"></script>
</html>
我想 click在 button (另一个)它用 class 给 div容器 render functions来自 indexAr.js ,
什么时候click在 button (英文)，它用 class 给 div容器AA
那是 render数据来自 index.js .
最佳答案
我认为当您使用 React router 并保留单个 index.js 文件时，问题可以更容易地解决。您无需单独捆绑这些文件。
你的路线将在 index.js 中并且看起来像
import {Router, hashHistory, Route} from 'react-router'
ReactDOM.render(
<Router history={hashHistory}>
<Route path="/" component={App}>
<Route path="another" component={Another}/>
<Route path="english" component={English}/>
</Route>
</Router>, document.getElementById('app')
)
你的 App 组件会是这样的
import {Link} from 'react-router';
class App extends React.Component {
render() {
return (
<div>
<button><Link to="another">Another</Link><button>
<button><Link to="english">English</Link></button>
<div>{this.props.children}</div>
</div>
)
}
}
我认为对于您要实现的目标，这是一种更好、 react 更灵敏的方法。
可以关注以下 youtube tutorial 用于设置你的 react 路由器
关于javascript - 如何单击按钮以获取具有反应的组件之一，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/41997805/