解决“未处理的拒绝TypeError：jquery_1.default不是函数”

Question

我试图在我的Aurelia附加函数中调用jQuery。每当jQuery命令运行时，我都会收到此错误：

未处理的拒绝TypeError：jquery_1.default不是函数。

这是我的app.ts代码：

    import {Redirect, NavigationInstruction, RouterConfiguration} from 'aurelia-router';
    import 'semantic';
    import $ from 'jquery';

    export class App {
      configureRouter(config: RouterConfiguration): void {
        config.title = 'TrackRack';
        config.options.hashChange = false;
        config.options.root = '/';
        config.map([
          { route: ['home'], name: 'home', moduleId: 'views/home' },
          { route: '', name: 'home2', moduleId: 'views/home'}
        ]);
      }
      attached() {
          $('.nav_menu').visibility({
            type: 'fixed'
          });
      }
    }

这是我的配置：

            {
                "name": "jquery",
                "path": "../node_modules/jquery/dist",
                "main": "jquery.js"
                },
                {
                "name": "semantic",
                "path": "../node_modules/semantic-ui/dist",
                "main": "semantic.js",
                "resources": [
                    "semantic.min.css"
                ]
            }

Answer 1

你需要在aurelia.json中做的就是

"jquery"

没有必要比jQuery更复杂。

另请注意，您可以在视图中使用ref自定义属性来获取视图中元素的引用。您可以将此引用传递给jQuery，而不是搜索元素。

app.html

<template>
  ...
  <nav ref="navMenu">
    ...
  </nav>
  ...
</template>

app.ts

 $(this.navMenu)).visibility({
     type: 'fixed'
 });