11、MobX实战应用与特殊API详解

最新推荐文章于 2025-10-22 18:44:49 发布

wasm7browser

最新推荐文章于 2025-10-22 18:44:49 发布

阅读量43

点赞数

CC 4.0 BY-SA版权

分类专栏： MobX深度解析：状态管理的艺术文章标签： MobX React 状态管理

本文链接：https://blog.youkuaiyun.com/wasm7browser/article/details/150141044

MobX深度解析：状态管理的艺术专栏收录该内容

15 篇文章 ¥499.90

订阅专栏¥69.90

会员秒杀 ¥9.9 重磅福利

超级会员免费看

MobX实战应用与特殊API详解

1. ShowCart组件

ShowCart组件用于展示购物车中的商品列表。它复用了 TemplateStepComponent ，并通过 renderDetails 属性来展示购物车的详细信息。以下是相关代码：

import React from 'react';
import {
    List,
    ListItem,
    ListItemIcon,
    ListItemText,
    Typography,
} from '@material-ui/core';
import { Divider } from '@material-ui/core/es/index';
import { TemplateStepComponent } from './shared';

export class ShowCart extends React.Component {
    render() {
        return (
            <TemplateStepComponent
                title={'Your Cart'}
                operationTitle={'Checkout'}
                renderDetails={step => {
                    const { items, itemTotal } = step;
                    return (