# Component Interface
name | Functional Dxplaination |
---|---|
Product Details productDetail | After the user clicks on the relevant item, they jump to the Mini Store product details page |
Shopping bag shoppingCart | Control users to jump to a Mini Store shopping bag page |
Order List orderList | Control users to jump to the Mini Store order list page and activate the "All" tab by default to display all order data. This can be set to activate the tabs "Unpaid," "Uncollected," "Refund / After Sale" |
Order Details orderDetail | Control users to jump to the Mini Store order details page |
After Sale Order Details refundDetail | Control users to jump to the Mini Store's sales order details page |
The following are examples of how to jump to another page using the navigateTo method
# I. Item Details Components
# (Note: To use this component, you need to introduce a small product component in your project first)
Component Dxplaination: Users click on Weixin Mini Program shelves of goods, will be in accordance with the developer's settings, jump to the corresponding Mini Store product details page.
const productId = [商品id] // 填写具体的商品Id
wx.navigateTo({
url: 'plugin-private://wx34345ae5855f892d/pages/productDetail/productDetail?productId=${productId}',
});
The example effect is as follows:

# Custom Shop / Home Button
Because there are buttons to jump to the store and the front page in pages such as the Mini Store, the component provides a way to customize the jump.
Add the following code to apagejs for Weixin Mini Program:
const miniShopPlugin = requirePlugin('mini-shop-plugin');
miniShopPlugin.initHomePath('your home page path'); // 比如'/pages/index/index'
# II. Shopping bag components
# (Note: To use this component, you need to introduce a small product component in your project first)
Component Dxplaination: When a user clicks on a shopping bag, they will be redirected to the corresponding Mini Store shopping bag page as set by the developer.
wx.navigateTo({
url: 'plugin-private://wx34345ae5855f892d/pages/shoppingCart/shoppingCart',
});
The example effect is as follows:

# III. Order List Component
# (Note: To use this component, you need to introduce a small product component in your project first)
Component Dxplaination: When a user clicks on the order list page, they will be redirected to the Mini Store order list page as set by the developer.
// Jump to the order page and activate the "All" tab by default to display all order data
wx.navigateTo({
url: 'plugin-private://wx34345ae5855f892d/pages/orderList/orderList',
});
// Jump to the order page to activate the "Unpaid" tab
const tabId = 'pendingPay';
wx.navigateTo({
url: `plugin-private://wx34345ae5855f892d/pages/orderList/orderList?tabId=${tabId}`,
});
Order List: The tabId potency is as follows:
Transfer value | label | data |
---|---|---|
pendingPay | Payment to be made | Orders pending payment |
pendingRecevied | To be received | Orders pending shipment / receiving status |
afterSale | Refunds / After Sale | All sales orders |
The example effect is as follows:

# IV. Order details component
# (Note: To use this component, you need to introduce a small product component in your project first)
Component Dxplaination: When a user clicks on the order details, they will be redirected to the respective Mini Store product order details page as set by the developer.
const orderId = [订单Id]; // 对应的订单Id
wx.navigateTo({
url: `plugin-private://wx34345ae5855f892d/pages/orderDetail/orderDetail?orderId=${orderId}`,
});
The example effect is as follows:

# V. Aftersales order details components
# (Note: To use this component, you need to introduce a small product component in your project first)
Component Dxplaination: When a user clicks on the after sale, they will be redirected to the corresponding Mini Store product after sale page as set by the developer.
const orderId = [售后单Id]; // 售后单Id
wx.navigateTo({
url: `plugin-private://wx34345ae5855f892d/pages/refundDetail/refundDetail?orderId=${orderId}`,
});
The example effect is as follows:
