jquery - 无法使用 React+Jquery 获取 Bootstrap 下拉菜单的选定文本
问题描述
这是下拉菜单的 Bootstrap 4 代码:
<div className="btn-group show">
<button className="btn btn-secondary btn-sm dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true" data-type="fontFamily" style="width: 100px;">Avenir Next</button>
<div className="dropdown-menu">
<a className="dropdown-item" href="#" style="font-family: "Avenir Next";">Avenir Next</a><a className="dropdown-item" href="#" style="font-family: Baghdad;">Baghdad</a>
<a className="dropdown-item" href="#" style="font-family: Helvetica;">Helvetica</a><a class="dropdown-item" href="#" style="font-family: Monotype;">Monotype</a>
<a className="dropdown-item" href="#" style="font-family: "Times New Roman";">Times New Roman</a>
<a className="dropdown-item" href="#" style="font-family: "Lucida Grande";">Lucida Grande</a>
<div className="dropdown-divider"></div>
<a className="dropdown-item" href="#" style="font-family: "Lucida Grande";">Lucida Grande</a>
</div>
这是反应部分:
componentDidMount(){
$('.dropdown-item').click((e) => {
console.log('text', $(e.currentTarget).text());
});
}
单击下拉列表时,没有任何反应。我不知道为什么。
请帮忙
解决方案
class="..."
应该className="..."
假设您使用的是 JSX。
也引出了你为什么使用 jquery + React 的问题......
推荐阅读
- python-3.x - 在单独的图上绘制图例时出错
- laravel - 服务器上的 Laravel 存储图像未显示
- laravel - 未定义变量:标题
- swiftui - 在 iOS 14 上获取小部件的数据
- python-3.x - 如何在python中打印最大数量的列表项和索引?
- vue.js - 如何收听在 vue js 中以编程方式创建的子事件?
- java - 如何阻止 Spring JPA 将参数转义到查询方法?
- python - 按其他列填充 NaN 值
- javascript - indexeddb 从索引 n 到索引 k 获取数据
- php - 请问如何在php MVC框架的多个文件夹中为任何类控制器动态设置命名空间