2

我想覆盖购物车模块存储中的操作。我正在尝试CartModule通过遵循此链接 Extending and Overriding Modules Doc来扩展它

/src/modules/cart/index.ts用以下代码创建了一个文件

import { VueStorefrontModuleConfig, extendModule, VueStorefrontModule } from '@vue-storefront/core/lib/module'
import { CartModule } from '@vue-storefront/core/modules/cart'

import { cartModule } from './store'

const cartExtend: VueStorefrontModuleConfig = {
    key: 'cart',
    store: {modules: [{key: 'cart', module: cartModule}]},
    afterRegistration: function () {
        console.log('Cart module extended')
    }
}

extendModule(cartExtend)

export const registerModules: VueStorefrontModule[] = [CartModule]

我收到CarModule类型不匹配的错误VueStorefrontModule

我也不知道下一步该怎么做才能使其有效。文档对此并不清楚。请帮忙。谢谢

4

1 回答 1

2

如果您想覆盖模块的操作,您不想扩展模块而是存储


这是示例:

Vuestorefront 有 CartModule (在核心中),您需要更改操作代码refreshTotals

在文件中编码/src/modules/cart/index.ts

import {StorefrontModule} from '@vue-storefront/core/lib/modules';
import {extendStore} from '@vue-storefront/core/helpers';

const cartModule = {
    action: {
        async refreshTotals({dispatch}, payload) {
            //
            // your new (and better!) code ;-)
            //
        }
    },
}

export const MyAwesomeCart: StorefrontModule = function () {
    extendStore('cart', cartModule);
}

在最后一步注册这个你的新模块:

..
...
import {CartModule} from '@vue-storefront/core/modules/cart';
import {MyAwesomeCart} from "modules/cart/index";

export function registerClientModules() {
    registerModule(CartModule); // original module 
    registerModule(MyAwesomeCart); // your new overwiritng module

...
..
于 2021-02-11T15:39:30.487 回答