如何在同一项目中使用React、jQuery和MaterializeCSS？
如何在同一项目中使用React、jQuery和MaterializeCSS？
提问于 2020-04-16 01:30:26
我是一个比较新的实现，我想我可以用它来开发一个与ReactJS的项目。不幸的是，看起来jQuery并不是React真正喜欢的。我试着写了一些虚拟代码，它只是用来显示Materialize提供的日期输入：
import React, { Component } from 'react';
import $ from 'jquery';
import 'materialize-css';
class App extends Component {
componentDidMount() {
$(document).ready(function() {
$('.datepicker').datepicker({
disableWeekends: true
});
})
}
render() {
return (
<div className="App">
<div className="input-field">
<input type="text" id="date" className="datepicker" />
<label for="date">Choose a date you need me for...</label>
</div>
</div>
);
}
}
export default App;这最后一段代码不起作用，我得到
TypeError: jquery__WEBPACK_IMPORTED_MODULE_1___default(...)(...).datepicker is not a function我不是jQuery的狂热粉丝，所以如果我需要的话，我可以放弃它，但是有没有办法我仍然可以使用它的方法(我需要访问它的方法来实现)？
回答 1
Stack Overflow用户
发布于 2020-04-16 14:40:15
jQuery不再是Materialize的依赖项，所以请使用普通的js初始化，而不是jQuery初始化：
document.addEventListener('DOMContentLoaded', function() {
var elems = document.querySelectorAll('.datepicker');
var instances = M.Datepicker.init(elems,{
disableWeekends: true
});
});因为jQuery不再是一个依赖项，所以所有的方法都在插件实例上调用。您可以像这样获取插件实例：
var instance = M.Datepicker.getInstance(elem);
instance.open();页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/61234942
复制相关文章
相似问题
腾讯云开发者
