jquery更改事件未在导出的模块中触发

时间:2018-05-28 08:47:05

标签: jquery webpack

我目前正在更新项目以使用webpack。我有两个脚本,一个主脚本和一个处理所有商店功能的辅助脚本。 shop脚本由具有许多功能的对象组成。然后使用module.exports导出对象。

我遇到的问题是change脚本中的productVariant.val(variant).change()函数shop未触发。

加载两个脚本而不是使用webpack的bundle时,事件发生了。我猜这是一个简单的解决方案,但似乎无法解决它。

由于我在主脚本中需要shop脚本,因此我没有将其包含在app.js中,不确定这是否有所作为。

App.js

// scripts
require('./main-js');

// css
require('../scss/style.scss');

主脚本

var $ = require('jquery');

var shopjs = require('./shop');
var shop = shopjs.shopObj;

// ...

$(document).ready(function () {
    // ...

    $('.variant').click(function () {
        var variant = $(this).data('variant');
        var display = $(this).data('display');
        var type = $(this).data('type');

        shop.updateVariant(variant, display, type);
    });

    // ...
});

购物脚本

var $ = require('jquery');

var shop = {
    updateProductQty: function (qty) {
        var productQty = $('.cart .qty');
        productQty.val(qty);
    },
    updateVariant: function (variant, display, type) {
        var productVariant = $('.cart #' + type);
        productVariant.val(variant).change();

        // ...
    }

    // ...
}

module.exports.shopObj = shop;

1 个答案:

答案 0 :(得分:0)

为什么要这样出口?

module.exports.shopObj = shop;

而是这样做:

module.exports = shop;

主脚本里面导入它:

var shopjs = require('./shop');

shopjs.updateVariant(....

然后使用带有babel的ES6导入。并且不要忘记不使用默认导出,因此您知道导出的内容和不导出的内容。