Question

我正在尝试将jQuery Clockpicker集成到我的react应用程序中，但是无论如何它都不想工作。我尝试了所有可能的方法，但没有结果。 jQuery本身运行良好，但clockpicker却不能。抛出一个错误

未捕获的TypeError：clockpicker.clockpicker不是函数

这是我的HTML和CDN链接

<!DOCTYPE html>
<html lang="en">
<head>
    <base href="/">
    <meta charset="utf-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <meta name="description" content="The Brring Web Client">
    <link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/clockpicker/0.0.7/bootstrap-clockpicker.min.css" integrity="sha256-lBtf6tZ+SwE/sNMR7JFtCyD44snM3H2FrkB/W400cJA=" crossorigin="anonymous" />
    <link rel="stylesheet" href="https://pro.fontawesome.com/releases/v5.1.0/css/all.css" integrity="sha384-87DrmpqHRiY8hPLIr7ByqhPIywuSsjuQAfMXAE0sMUpY3BM7nXjf+mLIUSvhDArs" crossorigin="anonymous">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/clockpicker/0.0.7/jquery-clockpicker.min.js"></script>
    <title>Document</title>
</head>
<body>
    <div id="app"></div>
    <script src="js/app.js"></script>
</body>
</html>

这是我初始化时钟选择器的功能

import * as $ from "jquery";   
 class example {
    ... other staff
    initializeTimePicker() {
        jQuery(function($) {
           let clockpicker = $(".clockpicker");
           clockpicker.clockpicker();
        });
     }
  }

  export default new CallUtil();

毕竟，我在另一个组件的 componentDidMount 生命周期中调用此函数。

import CallUtil from 'some_folder'    
componentDidMount(): void {
        CallUtil.initializeTimePicker();
}

我做错了什么？

jQuery Clockpicker不适用于React

0 个答案: