世界上最伟大的投资就是投资自己的教育

所有回复

 2025-01-24

 2025-01-23

 2024-12-27

 2024-11-28

 2024-10-22

 2024-08-05

 2024-05-21

 2024-04-17

 2024-02-21

  • 石伟 · 练虚
    石伟 · 练虚 在视频 Ant Desgin Pro v6 正式版本企业级从零开始实现动态菜单与权限视频教程 42 实现角色选择权限 part 2 回复了

    问题已找到，在 hooks 模块里面的 useEffect() 里面少了个,[]
    正确写法：
    useEffect(() => {
    query();
    }, []);

    23:59
  • 随风 · 练气
    随风 · 练气 在视频 Ant Desgin Pro v6 正式版本企业级从零开始实现动态菜单与权限视频教程 42 实现角色选择权限 part 2 回复了
    对 石伟 · 练虚 石伟 · 练虚 回复

    你 markdown 格式化一下代码

    14:01
  • 石伟 · 练虚
    石伟 · 练虚 在视频 Ant Desgin Pro v6 正式版本企业级从零开始实现动态菜单与权限视频教程 42 实现角色选择权限 part 2 回复了

    我根据课程的步骤，使用 hooks ,代码如下：

    baseForm.tsx 代码如下：

    import hGetDataList from "@/hooks/hGetDataList";
    import { ProFormText } from "@ant-design/pro-components";
    import { Form, FormInstance, Tree } from "antd";
    import type { Key } from "react";
    import { useState } from "react";

    interface Props {
    form: FormInstance;
    actions?: string[];
    }

    const FieldsForm: React.FC = (props) => {
    const { form,actions } = props;
    const {data:treedata} = hGetDataList('/api/Base_Manage/Base_Action/GetActionTreeList');
    const [expandedKeys, setExpandedKeys] = useState();
    const [checkedKeys, setCheckedKeys] = useState<
    Key[] | { checked: Key[]; halfChecked: Key[] }

    (actions as Key[] ?? []);
    const [selectedKeys, setSelectedKeys] = useState([]);
    const [autoExpandParent, setAutoExpandParent] = useState(true);

    const onExpand = (expandedKeysValue: Key[]) => {
    setExpandedKeys(expandedKeysValue);
    setAutoExpandParent(false);
    };

    const onCheck = (
    checkedKeysValue: Key[] | { checked: Key[]; halfChecked: Key[] }
    ) => {
    setCheckedKeys(checkedKeysValue);
    form.setFieldValue("Actions", checkedKeysValue as Key[]);
    };

    const onSelect = (selectedKeysValue: Key[], info: any) => {
    setSelectedKeys(selectedKeysValue);
    };
    return (
    <>
    rules={[
    {
    required: true,
    message: "请输入角色名称",
    },
    ]}
    width="xl"
    label="角色名称"
    name="RoleName"
    placeholder=""
    />

    checkable
    onExpand={onExpand}
    expandedKeys={expandedKeys}
    autoExpandParent={autoExpandParent}
    onCheck={onCheck}
    checkedKeys={checkedKeys}
    onSelect={onSelect}
    selectedKeys={selectedKeys}
    defaultExpandAll={true}
    treeData={treedata}
    // loadData={async () => {
    // const res = await getTreeDataList(
    // '/api/Base_Manage/Base_Action/GetActionTreeList');
    // if (! res.sucess) {
    // message.error(res.msg);
    // }
    // return res.data;
    // }}
    />







    </>
    );
    };

    export default FieldsForm;

    createForm.tsx 新建窗体代码如下：

    import { ModalForm } from "@ant-design/pro-components";
    import { Form } from "antd";
    import FieldsForm from "./FieldsForm";

    interface Props {
    open: boolean;
    onOpenChange: (visible: boolean) => void;
    onFinish: (formData: any) => Promise;
    }

    const CreateForm: React.FC = (props) => {
    const [form] = Form.useForm();
    const { open, onOpenChange, onFinish } = props;
    return (
    form={form}
    title={"新建"}
    width={"25%"}
    open={open}
    onOpenChange={onOpenChange}
    onFinish={onFinish}
    modalProps={{
    destroyOnClose: true,
    maskClosable: false,
    }}
    >


    );
    };

    export default CreateForm;

    EditForm.tsx 编辑代码如下：

    import { getTheData } from "@/services/hsoft/hfw/api";
    import { ModalForm } from "@ant-design/pro-components";
    import { Form, message } from "antd";
    import FieldsForm from "./FieldsForm";

    export type Props = {
    onCancel: (visible: boolean) => void;
    onSubmit: (values: HFW.Hfw_Roles) => Promise;
    updateModalOpen: boolean;
    values: Partial;
    };

    const EditForm: React.FC = (props) => {
    const { onCancel, onSubmit, updateModalOpen, values } = props;
    const [form] = Form.useForm();
    return (
    form={form}
    title={"编辑"}
    width={"25%"}
    open={updateModalOpen}
    onOpenChange={onCancel}
    onFinish={onSubmit}
    initialValues={values}
    request={async () => {
    const res = await getTheData(
    "/api/Base_Manage/Base_Role/GetTheData",
    values.Id
    );
    if (! res.sucess) {
    message.error(res.msg);
    }
    return res.data;
    }}
    modalProps={{
    destroyOnClose: true,
    maskClosable: false,
    }}
    >


    );
    };

    export default EditForm;

    在浏览器里点击新建或者编辑，浏览器就一直请求后端；直到关闭新建或编辑窗体，才停止后端请求；

    我看了你的视频，只向后端请求一次；

    13:29
  • 随风 · 练气
    随风 · 练气 在视频 Ant Desgin Pro v6 正式版本企业级从零开始实现动态菜单与权限视频教程 42 实现角色选择权限 part 2 回复了
    对 石伟 · 练虚 石伟 · 练虚 回复

    我查了下，里面应该是返回一个 promise

    就是你的这个 await getTreeDataList

    13:24
  • 石伟 · 练虚
    石伟 · 练虚 在视频 Ant Desgin Pro v6 正式版本企业级从零开始实现动态菜单与权限视频教程 42 实现角色选择权限 part 2 回复了

    Tree 树形控件 的。loadData 异步加载数据 function(node) -
    这个方法如何如何使用，我是这样用的，但是不请求后端
    loadData={async () => {
    const res = await getTreeDataList(
    '/api/Base_Manage/Base_Action/GetActionTreeList');
    if (! res.sucess) {
    message.error(res.msg);
    }
    return res.data;
    }}

    13:13
  • 石伟 · 练虚
    石伟 · 练虚 在视频 Ant Desgin Pro v6 正式版本企业级从零开始实现动态菜单与权限视频教程 32 更新员工 - 对接后端请求 回复了

    这个文件解决了，还是用了你的解决办法；谢谢！

    13:06

 2024-02-20

© 汕尾市求知科技有限公司 | Rails365 Gitlab | 知乎 | b 站 | csdn

粤公网安备 44152102000088号粤公网安备 44152102000088号 | 粤ICP备19038915号

Top